文檔中所有的節(jié)點之間都存在這樣或那樣的關(guān)系狂秘。節(jié)點間的各種關(guān)系可以用傳統(tǒng)的家族關(guān)系來描述，相當于把文檔樹比喻成家譜躯肌。在HTML中者春，可以將 元素看成是 元素的子元素；相應(yīng)地清女，也就可以將 元素看成是 元素的父元素钱烟。而 元素，則可以看成是 元素的同胞元素嫡丙，因為它們都是同一個父元素 的直接子元素拴袭。
每個節(jié)點都有一個 childNodes 屬性，其中保存著一個 NodeList 對象曙博。 NodeList 是一種類數(shù)組對象拥刻，用于保存一組有序的節(jié)點，可以通過位置來訪問這些節(jié)點羊瘩。請注意泰佳，雖然可以通過方括號語法來訪問 NodeList 的值盼砍，而且這個對象也有 length 屬性，但它并不是 Array 的實例逝她。 NodeList 對象的獨特之處在于浇坐，它實際上是基DOM結(jié)構(gòu)動態(tài)執(zhí)行查詢的結(jié)果，因此DOM結(jié)構(gòu)的變化能夠自動反映在 NodeList 對象中黔宛。我們常說近刘， NodeList 是有生命、有呼吸的對象臀晃，而不是在我們第一次訪問它們的某個瞬間拍攝下來的一張快照觉渴。
下面的例子展示了如何訪問保存在 NodeList 中的節(jié)點——可以通過方括號，也可以使用 item() 方法徽惋。
var firstChild = someNode.childNodes[0];
var secondChild = someNode.childNodes.item(1);
var count = someNode.childNodes.length;
無論使用方括號還是使用 item() 方法都沒有問題案淋，但使用方括號語法看起來與訪問數(shù)組相似，因此頗受一些開發(fā)人員的青睞险绘。另外踢京，要注意 length 屬性表示的是訪問NodeList 的那一刻，其中包含的節(jié)點數(shù)量宦棺。對 arguments 對象使用 Array.prototype.slice() 方法可以將其轉(zhuǎn)換為數(shù)組瓣距。而采用同樣的方法，也可以將 NodeList 對象轉(zhuǎn)換為數(shù)組代咸。來看下面的例子：
//在IE8及之前版本中無效
var arrayOfNodes = Array.prototype.slice.call(someNode.childNodes,0);
除IE8及更早版本之外蹈丸，這行代碼能在任何瀏覽器中運行。由于IE8及更早版本將 NodeList 實現(xiàn)為一個COM對象呐芥，而我們不能像使用JScript對象那樣使用這種對象逻杖，因此上面的代碼會導(dǎo)致錯誤。要想在IE中將 NodeList 轉(zhuǎn)換為數(shù)組思瘟，必須手動枚舉所有成員弧腥。下列代碼在所有瀏覽器中都可以運行：
function convertToArray(nodes){
var array = null;
try {
array = Array.prototype.slice.call(nodes, 0); //針對非IE瀏覽器
} catch (ex) {
array = new Array();
for (var i=0, len=nodes.length; i < len; i++){
array.push(nodes[i]);
}
}
return array;
}
這個 convertToArray() 函數(shù)首先嘗試了創(chuàng)建數(shù)組的最簡單方式。如果導(dǎo)致了錯誤（說明是在IE8及更早版本中）潮太，則通過 try-catch 塊來捕獲錯誤，然后手動創(chuàng)建數(shù)組虾攻。這是另一種檢測怪癖的形式铡买。
相關(guān)鏈接DOM節(jié)點分析Web前端精髓
