dom總結(小白專用)

2021-10-13 05:26:01 字數 1812 閱讀 1247

html dom 定義了訪問和操作 html 文件的標準方法。

dom 就是document object model,文件物件模型。

根據 w3c 的 html dom 標準,html 文件中的所有內容都是節點:

整個文件是乙個文件節點

每個 html 元素是元素節點

也就是說網頁的html標籤元素是元素節點。例如 p 和span元素

html 元素內的文字是文字節點

網頁中的html標籤內容。文字節點的節點型別nodetype值是3,節點名稱nodename值是』#text』,nodevalue值是標籤內容值。

每個 html 屬性是屬性節點

屬性節點用來對元素做出更具體的描述,其實就是網頁中html標籤的屬性,它只存在於元素的attributes屬性中。

title="a gentle reminder"即為乙個屬性節點

注釋是注釋節點

html注釋是注釋節點。注釋節點的節點型別nodetype的值為8,節點名稱nodename的值為』#comment』,nodevalue的值為注釋的內容。

dom查詢方法

通過元素id

document.getelementbyid(id); 返回乙個物件,(返回按id屬性查詢的第個物件的引用。)

例如document.getelemntbyid(「id_reminder」);

通過標籤名字tagname

document.getelementsbytagname(「p」); 返回乙個物件陣列,(返回按帶有指定名稱name 查詢的物件的集合,由於乙個文件中可能會有多個同名節點(如核取方塊、 單選按鈕),因此返回的是元素陣列)

通過類名字clasname(html5支援)

document.getelementsbyclassname(「class_reminder」); 返回乙個物件陣列

根據name屬性的值獲取元素(getelementsbyname)

document.getelementsbyclassname(「name屬性的值」); 返回值是乙個偽陣列

獲取html的方法(document.documentelement)

獲取body的方法(document.body)

1.getattribute獲取屬性值

object.getattribute(attribute);

例如:

"demo"

data

="123"

>

div>

var d1 = document.getelementbyid('demo');

var value = d1.getattribute('data');

console.log(value); ///輸出 123

注意:要先找到這個元素,再獲取當前元素的屬性值。

2.setattribute設定相應屬性的屬性值

object.setattribute(attribute,value);

"demo"

data

="123"

>

div>

var d2= document.getelementbyid('demo');

d2.setattribute('data',456); //設定屬性data的值為 456

var value = d2.getattribute('data',456);

console.log(value);///輸出 456

C String詳解 小白專用

include string string s hello world char temp hello world string s temp string s hello world char temp char s.c str 此處一定要加強制型別轉化,c str 返回的是乙個臨時指標,不能對其...

Redis安裝方法(小白專用)

鄭重宣告 本安裝教程親測成功,且純粹小白級別,如有覺得不專業的,你咬我啊。之前就聽說了redis這個東東,一直都不明覺厲,今天決定裝來玩玩。因為redis的作者認為linux的網路效能已經是大家都有目共睹了,鄙視windows,所以redis的執行環境是在linux下的。所需的軟硬環境 1 linu...

Git基本操作(詳,小白專用)

git 基本快照 git標籤 git檢視提交歷史 配置使用者名稱及郵箱 設定git預設使用的文字編輯器 設定差異分析工具 git版本資訊 移除原來的版本 也可以自己指定生成的倉庫目錄 git init newname 例 git clone ebookchain git clone 時,可以所用不同...