DOM 基礎知識

2022-01-31 06:34:30 字數 2030 閱讀 7192

dom樹中的元素節點:

節點的屬性:

x.nodevalue 節點物件x的值(唯讀)

元素節點的 nodename 與標籤名相同

屬性節點的 nodename 是屬性的名稱

文字節點的 nodename 永遠是 #text

文件節點的 nodename 永遠是 #document

x.nodename 節點物件x的名稱

元素節點的 nodevalue 是 undefined

文字節點的 nodevalue 是文字自身

屬性節點的 nodevalue 是屬性的值

x.nodetype 節點物件x的型別(唯讀)

元素型別

節點型別元素1

屬性2文字3

注釋8文件9

節點定位:

x.parentnode 節點物件x的父節點

x.childnodes 節點物件x的子節點

dom 查詢及操作節點的方法:

insertbefore()  在參考子節點之前插入乙個新的子節點.如果參考的子節點為null,則新的子節點將作為呼叫節點的最後乙個子節點插入。

replacechild()  在childnodes集合種使用指定的newchild來代替oldchild;如果代替成功,則返回oldchild;如果newchild是null,則只需刪除oldchild即可。

clonenode() 建立乙個新的、複製的節點,並且如果傳入的引數是true時,還將複製子節點,如果節點是乙個元素,那麼還將複製相應屬性,返回新的節點。

getelementbyid()  根據id查詢元素節點

getelementsbytagname()   根據tagname查詢元素節點

createelement()  建立新的元素節點

createtextnode()  建立新的文字節點

getattribute() 獲取屬性的值

setattribute() 設定屬性的值

節點列表:

由 getelementsbytagname() 方法和 childnodes 屬性返回。

x.length  節點列表x的長度(節點的數目)

屬性節點列表:

元素節點的 attributes 屬性返回屬性節點的列表。

x.length  屬性節點列表的長度(屬性節點的數目)

x.getnameditem()  返回屬性節點

注意:

2005

,元素節點 ,擁有乙個值為 "2005" 的文字節點。

"2005"不是元素的值!文字總是儲存在文字節點中。

dom基礎知識

dom 英文全稱 document object model 譯成中文即是 文件對像模型 聽起來很術語,其實就是文件內容的結構關係 文件型別可以是html或xml,dom具有對html檔案和xml檔案元素的訪問控制能力,簡單點說利用dom可以對某個html或xml檔案新增,修改,刪除元素 更改其現有...

DOM基礎知識

首先,我們需要介紹什麼是dom。dom的英語全稱為document object model,翻譯成中文就 是文件物件模型。也就是說,將整個文件看作是乙個物件。而乙個文件又是由很多節點組成的,那麼這些節點也可以被看作是乙個個的物件。dom裡面的物件屬於宿主物件,需要瀏覽器來作 為宿主。一旦離開了瀏覽...

DOM小基礎知識

1.獲取頁面中的html元素 2.獲取或改變頁面中的html元素內容 3.獲取或改變頁面中的html屬性 4.獲取或改變頁面中的css樣式 5.為元素繫結事件 6.建立html元素 7.刪除已有的html元素 通過id查詢html元素 唯一 var p document.getelementbyid...