使用document.getElementsByTagName進行DOM操作

Question

我注意到這個方法只有在插入[0]時才起作用，但是在語法文檔中我找不到它的目的或解釋。這是做什麼的，爲什麼沒有它的代碼無法運行？

document.getElementsByTagName('body')[0].style.backgroundColor = "pink" 

Answer 1

getElementsByTagName返回一個NodeList，它是與標籤匹配的所有元素的集合。由於它是一個集合，而不是單個元素，因此您需要指定要在集合上操作的集合中的哪些項目。 A NodeList與數組相似，因此您使用下標訪問集合中的各個元素 - [0]意味着第一個元素。如果你想要做的事，以所有匹配的元素，你可以使用一個for循環：

var anchors = document.getElementsByTagName('a'); 
for (i = 0; i < anchors.length; i++) { 
    anchors[i].style.backgroundColor = 'red'; 
} 

在body的情況下，你知道，只會有其中之一，所以沒有必要爲此，你只需要用[0]來索引它。

Answer 2

此方法返回與提供的標記名稱相匹配的元素的集合（數組）。即使只有一個與標籤名稱匹配的元素，它也會這樣做。當您爲方法結果提供整數時，您正在尋址數組中的特定元素。有關陣列的基本信息，請看這裏：http://www.w3schools.com/js/js_obj_array.asp