Javascript - số nút con

Question

<ul> 
    <li>Array1</li> 
    <li>Array2</li> 
    <li id="element">Array3</li> 
</ul> 
<script> 
    var temp = document.getElementById('element').parentNode; 
    child = temp.childNodes; 
    console.log(temp.length); 
</script> 

Tôi cần có độ dài nút con bằng cách sử dụng id phần tử. Mã của tôi trả về 7 kết quả nhưng tôi chỉ có 3 nút.

Answer 1

Điều gì bạn muốn là .children.length hoặc .childElementCount (không được khuyến nghị) kể từ childNodes được tất cả ChildNodes, cũng là các nút văn bản 4 trong trường hợp của bạn (dấu ngắt dòng).

var temp = document.getElementById('element').parentNode; 
child = temp.children; 
console.log(child.length); 
// or the following 
console.log(temp.childElementCount); 

Answer 2

childNodes trả về 3 mục danh sách, nội dung văn bản và khoảng trắng giữa chúng (mặc dù không có trong tất cả các trình duyệt). Ba lựa chọn:

1. FF và Chrome: elem.childElementCount (sẽ trở lại 3)

2. IE (& & FF AFAIK): elem.childNodes.length (=== 3)

3. IE cũ: elem.children.length

Answer 3

Thuộc tính childrenNodes bao gồm tất cả các loại nút: TEXT_NODE, EL EMENT_NODE, COMMEN_NODE, vv ....

Bạn cần phải đếm số lượng các yếu tố, đây là an example solution dựa trên DOM mà nên làm việc trong tất cả các động cơ:

var temp = document.getElementById('element').parentNode; 
var children = temp.childNodes; 
console.log(children.length); // 7 

function countElements(children) { 
    var count=0; 
    for (var i=0, m=children.length; i<m; i++) 
    if (children[i].nodeType===document.ELEMENT_NODE) 
     count++; 
    return count; 
} 
console.info(countElements (children));​ // 3 

EDIT

Tương tự nếu bạn muốn có một hàm để truy xuất tất cả các phần tử con chỉ sử dụng DOM, đây là một hàm:

function childElements(node) { 
    var elems = new Array(); 
    var children = node.childNodes; 

    for (var i=0,i < children.length ; i++) { 
     if (children[i].nodeType===document.ELEMENT_NODE) { 
      elems.push(children[i]); 
      return elems; 
      } 
     } 
    } 

console.info(childElements(temp).length);​ //3