children和childNodes差別【轉】

1，childNodes屬性，標準的，它返回指定元素的子元素集合，包括html節點，全部屬性，文本。能夠經過nodeType來判斷是哪一種類型的節點，只有當nodeType==1時纔是元素節點，2是屬性節點，3是文本節點。

有些人錯誤的使用()去取該集合元素，下表列出各瀏覽器對childNodes(i)的支持狀況：

  2，有時候須要獲取指定元素的第一個html子節點（非屬性/文本節點），最容易想到的就是firstChild屬性。代碼中第一個html節點前若是有換行，空格，那麼firstChild返回的就不是你想要的了。能夠使用nodeType來判斷下。

Js代碼 

function getFirst(elem){  
      for(var i=0,e;e=elem.childNodes\[i++\];){  
          if(e.nodeType==1)  
              return e;  
      }         
  }

  3，children屬性，非標準的，它返回指定元素的子元素集合。經測試，它只返回html節點，甚至不返回文本節點。且在全部瀏覽器下表現驚人的一致。和childNodes同樣，在firefox下不支持()取集合元素。所以若是想獲取指定元素的第一個html節點，能夠使用children[0]來替代上面的getFirst函數。需注意children在IE中包含註釋節點。

相關資源：

http://www.w3.org/TR/2000/REC-DOM-Level-2-Core-20001113/core.html#ID-1451460987

http://www.w3.org/TR/2004/REC-DOM-Level-3-Core-20040407/core.html#ID-1451460987

http://www.w3.org/TR/2004/REC-DOM-Level-3-Core-20040407/core.html#ID-536297177

https://developer.mozilla.org/En/DOM/Element.children

http://msdn.microsoft.com/en-us/library/ms537446%28VS.85%29.aspx

文章來自：https://www.iteye.com/blog/snandy-547369