节点处理理解难题

Question

<div id="wrapper">
<span id="c1">hello</span>
<div id="c2">world</div>
</div>function $(i)
{
    return document.getElementById(i);
}
for(var i=0;i<$("wrapper").childNodes.length;i++)
    alert($("wrapper").childNodes[i].nodeName);问题是
谷歌反应 #text SPAN #text DIV #text
火狐   #text SPAN #text DIV #text
IE8 SPAN #text DIV我就纳闷了，，childNodes返回节点列表嘛，怎么去理解啊？？对这个属性云里雾里了

Answer 1

楼主把换行去掉试试
<div id="wrapper"><span id="c1">hello</span><div id="c2">world</div></div>不换行，就一样了，
因为火狐会把换行都认为是一个节点
最好用children替代childNodes

Answer 2

childNodes是返回所有子节点，请注意文本是包含在文本节点里面的，会出现上面的差别是IE会自动忽略所有空字符(空格，回车，制表符)，而firefox和chrome不会忽略，还是把他当成一个文本值为空的文本节点，将你的代码修改一下就很好理解了<!-- 将所有回车空格删除后效果就一样了 --><div id="wrapper"><span id="c1">hello</span><div id="c2">world</div></div>function $(i)
{
    return document.getElementById(i);
}
for(var i=0;i<$("wrapper").childNodes.length;i++)
    alert($("wrapper").childNodes[i].nodeName);