使用javascript來計算元素的直接子元素

Question

我可以得到一個元素的所有後代的計數，但我似乎無法只針對即時孩子。這是我目前所擁有的。

var sectionCount = document.getElementById("window").getElementsByTagName("section").length; 

我已經玩過其他的東西和不同的語法，但我似乎無法得到它。

jQuery的等效是：

var sectionCount = $("#window > section").length; 

但我需要做的只是這個JavaScript。

Answer 1

使用DOM選擇器接口（querySelectorAll）。

var selectionCount = document.querySelectorAll("#window > section").length; 

如果你想有一個向後兼容的解決方案，通過childNodes環路和計數元素節點。

var w = document.getElementById('window'); 
var count = 0; // this will contain the total elements. 
for (var i = 0; i < w.childNodes.length; i++) { 
    var node = w.childNodes[i]; 
    if (node.nodeType == Node.ELEMENT_NODE && node.nodeName == "SECTION") { 
     count++; 
    } 
}