javascript检查子节点是元素还是文本节点

我有问题与childNodes如下：

  <ol> <li>Coffee</li> <li>Tea</li> <li>Coca Cola</li> </ol> //childNodes.length = 7 

但

 <ol><li> Coffee </li><li> Tea </li><li> Coca Cola </li></ol> //childNodes.length = 3 

看来每个\n或textnode被认为是一个child ，我怎么能从childNodes删除这些？

Answer 1

您可以使用nodeType检查给定的子节点是否是文本节点。 文本节点的节点types为3 。 我们可以使用数字或常量Node.TEXT_NODE进行检查。

 window.onload = function() { var el = document.getElementsByTagName('ol')[0].childNodes; // using [0] as there is only one ol in the demo console.log('Print with text nodes'); for (var i = 0; i < el.length; i++) { // will output all nodes with "undefined" for text nodes console.log(el[i].innerHTML); } console.log('Print without text nodes'); for (var i = 0; i < el.length; i++) { // will output only non text nodes. if (el[i].nodeType != Node.TEXT_NODE) // or if (el[i].nodeType != 3) console.log(el[i].innerHTML); } } 

 <ol> <li>Coffee</li> <li>Tea</li> <li>Coca Cola</li> </ol> 

Answer 2

尝试使用jQuery的儿童方法
$("#test").children().size()

http://jsfiddle.net/72Ya3/2/