JavaScript如何存取節點

存取節點的方法：1、使用ownerDocument屬性；2、使用parentNode屬性；3、使用childNodes屬性；4、使用firstChild屬性；5、使用lastChild屬性；6、使用nextSibling屬性等。

本教學操作環境：windows7系統、javascript1.8.5版、Dell G3電腦。

透過節點之間的樹狀關係，我們可以定位文件中每個節點。 DOM 為 Node 類型定義下列屬性，以方便 JavaScript 對文件樹中每個節點進行遍歷。

• ownerDocument：傳回目前節點的根元素（document 物件）
• parentNode：傳回目前節點的父節點。所有的節點都只有一個父節點
• childNodes：傳回目前節點的所有子節點的節點清單
• firstChild：傳回目前節點的首個子節點
• lastChild：傳回目前節點的最後一個子節點
• nextSibling：傳回目前節點之後相鄰的同級節點
• previousSibling：傳回目前節點之前相鄰的同級節點

#【1】childNodes

每個節點都有一個childNodes 屬性，該屬性保存著一個nodeList 對象，它表示所有子節點的清單。

nodeList 是一種類別數組對象，用於保存一組有序的節點，使用者可以透過下標位置來存取這些節點。雖然 childNodes 可以透過方括號語法來存取 nodeList 的值，而且 childNodes 物件包含一個 length 屬性，它表示清單包含子節點的個數（長度），但 childNodes 並不是數組，不能夠直接調動數組的方法。

【2】parentNode

每個節點都有一個 parentNode 屬性，該屬性指向文件樹中的父節點。包含在 childNodes 清單中的所有節點都具有相同的父節點，因此它們的 parentNode 屬性都指向同一個節點。

parentNode 屬性傳回節點永遠是一個元素類型節點，因為只有元素節點才可能包含子節點。不過 document 節點沒有父節點，document 節點的 parentNode 屬性會回傳 null。

【3】firstChild 和 lastChild

firstChild 屬性傳回第一個子節點，lastChild 屬性傳回最後一個子節點。文字節點和屬性節點的 firstChild 和 lastChild 屬性傳回值總是為 null。

注意：firstChild 等價於 childNodes 的第一個元素，lastChild 屬性值等價於 childNodes 的最後一個元素。

node.childNodes[0] = node.firstChild
node.childNodes[node.childNodes.length-1]  = node.lastChild

【4】nextSibling 和 previousSibling

nextSibling 屬性傳回下一個相鄰節點，previousSibling 屬性傳回上一個相鄰節點。如果沒有同屬一個父節點的相鄰節點，則它們將傳回 null。

【5】ownerDocument

在 DOM 文件樹中，可以使用 ownerDocument 屬性存取根節點。

node.ownerDocument

透過每個節點的 ownerDocument 屬性，我們可以不必透過層層回溯的方式到達頂端，而是可以直接存取文件節點。另外，使用者也可以使用下面方式存取根節點。

document.documentElement

【相關推薦：javascript學習教學】

#

以上是JavaScript如何存取節點的詳細內容。更多資訊請關注PHP中文網其他相關文章！