訪問(wèn)節(jié)點(diǎn)的方法：1、使用ownerDocument屬性；2、使用parentNode屬性；3、使用childNodes屬性；4、使用firstChild屬性；5、使用lastChild屬性；6、使用nextSibling屬性等。

本教程操作環(huán)境：windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。

通過(guò)節(jié)點(diǎn)之間的樹(shù)形關(guān)系，我們可以定位文檔中每個(gè)節(jié)點(diǎn)。DOM 為 Node 類(lèi)型定義如下屬性，以方便 JavaScript 對(duì)文檔樹(shù)中每個(gè)節(jié)點(diǎn)進(jìn)行遍歷。

• ownerDocument：返回當(dāng)前節(jié)點(diǎn)的根元素（document 對(duì)象）
• parentNode：返回當(dāng)前節(jié)點(diǎn)的父節(jié)點(diǎn)。所有的節(jié)點(diǎn)都僅有一個(gè)父節(jié)點(diǎn)
• childNodes：返回當(dāng)前節(jié)點(diǎn)的所有子節(jié)點(diǎn)的節(jié)點(diǎn)列表
• firstChild：返回當(dāng)前節(jié)點(diǎn)的首個(gè)子節(jié)點(diǎn)
• lastChild：返回當(dāng)前節(jié)點(diǎn)的最后一個(gè)子節(jié)點(diǎn)
• nextSibling：返回當(dāng)前節(jié)點(diǎn)之后相鄰的同級(jí)節(jié)點(diǎn)
• previousSibling：返回當(dāng)前節(jié)點(diǎn)之前相鄰的同級(jí)節(jié)點(diǎn)

【1】childNodes

每個(gè)節(jié)點(diǎn)都有一個(gè) childNodes 屬性，該屬性保存著一個(gè) nodeList 對(duì)象，它表示所有子節(jié)點(diǎn)的列表。

立即學(xué)習(xí)“Java免費(fèi)學(xué)習(xí)筆記（深入）”；

nodeList 是一種類(lèi)數(shù)組對(duì)象，用于保存一組有序的節(jié)點(diǎn)，用戶可以通過(guò)下標(biāo)位置來(lái)訪問(wèn)這些節(jié)點(diǎn)。雖然 childNodes 可以通過(guò)方括號(hào)語(yǔ)法來(lái)訪問(wèn) nodeList 的值，而且 childNodes 對(duì)象包含一個(gè) length 屬性，它表示列表包含子節(jié)點(diǎn)的個(gè)數(shù)（長(zhǎng)度），但 childNodes 并不是數(shù)組，不能夠直接調(diào)動(dòng)數(shù)組的方法。

【2】parentNode

每個(gè)節(jié)點(diǎn)都有一個(gè) parentNode 屬性，該屬性指向文檔樹(shù)中的父節(jié)點(diǎn)。包含在 childNodes 列表中的所有節(jié)點(diǎn)都具有相同的父節(jié)點(diǎn)，因此它們的 parentNode 屬性都指向同一個(gè)節(jié)點(diǎn)。

parentNode 屬性返回節(jié)點(diǎn)永遠(yuǎn)是一個(gè)元素類(lèi)型節(jié)點(diǎn)，因?yàn)橹挥性毓?jié)點(diǎn)才可能包含子節(jié)點(diǎn)。不過(guò) document 節(jié)點(diǎn)沒(méi)有父節(jié)點(diǎn)，document 節(jié)點(diǎn)的 parentNode 屬性將返回 null。

【3】firstChild 和 lastChild

問(wèn)問(wèn)小宇宙

問(wèn)問(wèn)小宇宙是小宇宙團(tuán)隊(duì)出品的播客AI檢索工具

77

查看詳情

firstChild 屬性返回第一個(gè)子節(jié)點(diǎn)，lastChild 屬性返回最后一個(gè)子節(jié)點(diǎn)。文本節(jié)點(diǎn)和屬性節(jié)點(diǎn)的 firstChild 和 lastChild 屬性返回值總是為 null。

注意：firstChild 等價(jià)于 childNodes 的第一個(gè)元素，lastChild 屬性值等價(jià)于 childNodes 的最后一個(gè)元素。

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

【4】nextSibling 和 previousSibling

nextSibling 屬性返回下一個(gè)相鄰節(jié)點(diǎn)，previousSibling 屬性返回上一個(gè)相鄰節(jié)點(diǎn)。如果沒(méi)有同屬一個(gè)父節(jié)點(diǎn)的相鄰節(jié)點(diǎn)，則它們將返回 null。

【5】ownerDocument

在 DOM 文檔樹(shù)中，可以使用 ownerDocument 屬性訪問(wèn)根節(jié)點(diǎn)。

node.ownerDocument

通過(guò)每個(gè)節(jié)點(diǎn)的 ownerDocument 屬性，我們可以不必通過(guò)層層回溯的方式到達(dá)頂端，而是可以直接訪問(wèn)文檔節(jié)點(diǎn)。另外，用戶也可以使用下面方式訪問(wèn)根節(jié)點(diǎn)。

document.documentElement

【相關(guān)推薦：javascript學(xué)習(xí)教程】

以上就是JavaScript如何訪問(wèn)節(jié)點(diǎn)的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！