先來看一張簡(jiǎn)單的文檔樹

很明顯樹的頂層節(jié)點(diǎn)是NodeA節(jié)點(diǎn),接下來可以通過指定的合適節(jié)點(diǎn)移動(dòng)到樹中的任何點(diǎn),結(jié)合以下的代碼你可以更好的了解這棵樹節(jié)點(diǎn)間的相互關(guān)系:
NodeA.firstChild = NodeA1
NodeA.lastChild = NodeA3
NodeA.childNodes.length = 3
NodeA.childNodes[0] = NodeA1
NodeA.childNodes[1] = NodeA2
NodeA.childNodes[2] = NodeA3
NodeA1.parentNode = NodeA
NodeA1.nextSibling = NodeA2
NodeA3.previousSibling = NodeA2
NodeA3.nextSibling = null
NodeA.lastChild.firstChild = NodeA3a
NodeA3b.parentNode.parentNode = NodeA
DOM定義對(duì)操作一個(gè)文檔對(duì)象的節(jié)點(diǎn)結(jié)構(gòu)提供了實(shí)用的方法,它提供了像執(zhí)行對(duì)象插入,更新,刪除,克隆等這些常用的方法。
insertBefore()--在參考子節(jié)點(diǎn)之前插入一個(gè)新的子節(jié)點(diǎn).如果參考的子節(jié)點(diǎn)為null,則新的子節(jié)點(diǎn)將作為調(diào)用節(jié)點(diǎn)的最后一個(gè)子節(jié)點(diǎn)插入。
replaceChild()--在childNodes集合種使用指定的newChild來代替oldChild;如果代替成功,則返回oldChild;如果newChild是null,則只需刪除oldChild即可。
removeChild()--從節(jié)點(diǎn)的ChildNodes集合中刪除removeChild指定的節(jié)點(diǎn),如果刪除成功,則返回刪除的子節(jié)點(diǎn)。
appendChild()--添加一個(gè)新節(jié)點(diǎn)到childNodes集合的末尾,如果成功,則返回新節(jié)點(diǎn)。
cloneNode()--創(chuàng)建一個(gè)新的、復(fù)制的節(jié)點(diǎn),并且如果傳入的參數(shù)是true時(shí),還將復(fù)制子節(jié)點(diǎn),如果節(jié)點(diǎn)是一個(gè)元素,那么還將復(fù)制相應(yīng)屬性,返回新的節(jié)點(diǎn)。
為了在一棵文檔樹中訪問或者建立一個(gè)新的節(jié)點(diǎn),可以用下面這些方法:
getElementById()
getElementsByTagName()
createElement()
createAttribute()
createTextNode()