JavaScript学习-DOM扩展_元素遍历

1，介绍

• 对于元素间的空格，IE9及之前的版本不会反悔文本节点，而其他所有浏览器都会返回文本节点。这样就导致了再使用childNodes和firstChild等属性时的行为不一致。为了弥补这一差异，而同时DOM规范不变，Element Traversal规范新定义了一组属性。

2，添加的5个属性

• childElementCount:返回子元素（不包括文本节点和注释）的个数。
• firstElementChild:指向第一个子元素；firstChild的元素版。
• lastElementChild:指向最后一个子元素；lastChild的元素版。
• previousElementSibing:指向前一个同辈元素；previousSibling的元素版。
• nextElementSibling：指向后一个同辈元素；nextSibling的元素版。

3，代码示例

• 旧有的写法

  var i,
      len,
      child = element.firstChild;
  while(child != element.lastChild){
      if(child.nodeType == 1){
          processChild(child);
      }
      child = child.nextSibling;
  }

• 使用Element Traversal的写法

  var i,
      len,
      child = element.firstElementChild;
  while(child != element.lastElementChild){
      processChild(child);
      child = child.nextElementSibling;
  }