瞭解javascript DOM核心思想：nodeList vs HTMLElement對象

Question

我一直在努力非常徹底地理解DOM。目前，我正在通過遍歷DOM樹的方式，我似乎發現了一些不一致之處。

• 當我選擇1種多元素的節點列表返回
• 當我只選擇1元一個HTML元素返回

所以現在的問題是，爲什麼這個代碼回報一個nodeList，即使我只選擇1裏。

看到這個搗鼓一個例子：http://jsfiddle.net/AmhVk/5

有人能非常徹底地給我講解一下？ THX ...

<ul id="jow"> 
    <li><a href="">Item</a></li>  
    <li><a href="">Item</a></li> 
    <li class="active"><a href="">Item</a></li> 
    <li><a href="">Item</a></li> 
    <li><a href="">Item</a></li> 
</ul> 

<div id="ieps"></div> 

function simple(){ 

var li = document.querySelectorAll(".active"); 
var ul = li[0].parentNode; 
var getULchild = ul.children[0]; 

var ieps = document.getElementById("ieps"); 

ieps.innerHTML += "ul will return = " + ul + "<br>"; 
ieps.innerHTML += "li will return = " + li + "<br><br>";   

ieps.innerHTML += "ul[0] will return: " + ul[0] + "<br>"; 
ieps.innerHTML += "li[0] will return: " + li[0] + "<br><br>"; 

} 

Answer 1

更正：

• 一個，當你調用它可以選擇超過1元的函數節點列表返回
• 一個HTML元素當你調用一個返回功能最多可以選擇1個元素

這樣你沒有在每次調用時測試返回值的類型。

querySelectorAll旨在返回未定義數量的元素，因此它返回nodeList。

相反，當您使用getElementById（因爲一個元素最多可能有給定的id）時，返回nodeList通常沒有意義，這就是爲什麼它直接返回一個元素（或null）的原因。