先看两个对象：
对象一：

<div id="test1"><!--第一个遍历对象，节点之间留有空格和回车--> <div>Test Content</div> <div>Test Content</div> <div>Test Content</div> </div>

对象二：

<div id="test2"><!--第二个遍历对象，除注释外，节点间无空格回车--><div>Test Content</div><div>Test Content</div><div>Test Content</div></div>

用IE和Firefox运行如下代码：

var test1 = document.getElementById('test1'); var test2 = document.getElementById('test2'); var childs1 = test1.childNodes; var childs2 = test2.childNodes; document.write('test1的长度： '+childs1.length); document.write('test2的长度： '+childs2.length);

结果却是两个不同的答案。。。
IE下的结果：

test1的长度：3 test2的长度：3

而在Firefox下的结果却是：

test1的长度：7 test2的长度：3

在结构上，对象一和对象二不同的是对象一的子节点间有回车或者空格，而对象二则是一行写到尾。看到这里，估计你也猜到了，IE将一个完整标签作为一个节点。而Firefox，除了上述的的情况外，也会把一个标签的结束符“>”到下一个标签的起始符“<”之间的内容（除注释外，包括任何的文字、空格、回车、制表符）也算作是一个节点。

倒塌。。。也就是说，要想对JS代码不做改动的情况下做到兼容，那么你就得把对象中的上面提到的在Firefox中也会认为是节点的内容全部去掉，不过谁要是在写代码的时候把必要的格式化代码的回车、空格等都去掉了的话，这代码估计没法看了。。。至少我是不愿意看。。。

在使用javascript的时候，我们也许都用过getElementsByTagName和childNodes来遍历节点，我个人看来，用getElementsByTagName遍历DOM结构层次复杂的树时，与使用childNodes相比起来就差远了，childNodes对DOM的结构层次能更好的处理。