【JavaScript】DOM差异——nextSibli…

原文地址：DOM差异——nextSibling、childNodes作者：achilles

one:

 

one

two

three

这段代码在火狐下输出为‘undefined’,在IE下输出为‘item2’。请看two代码。

two:

 

one

two

three

IE下输出1、3；火狐下输出3、7。（节点类型为1表示元素节点，节点类型为3表示文本节点）

总结1与2：在火狐下空白、换行等文本信息也会被当成nextSibling跟childNodes的一员或作用对象！

解决方案：

1、去掉空白和换行。这样做绑定了HTML的结构，让程序和HTML产生了耦合！

2、见代码three.

three:

 
one

two

three

 

有没有好的方法？见代码four。

four:

 

one

two

three

通过 if(!document.all)如果非IE。进入无限循环，跳出的原因是找到下一个元素节点。这么写如果别的地方也需要nextSibling,我们又要再写一遍IF判断。代码的重用性不高如代码五。

five:

 

one

two

three

可读性这么差的代码。。。不用看了，看代码SIX。-封装成getNextNode。

six:

 

one

two

three