IE与FireFox中的childNodes区别

时间: 作者:展位

  

[childNodes]IE与FireFox中的childNodes区别

  Javascript中,相信大家都试过用getElementsByTagName和childNodes来实现对节点的遍历。但是 getElementsByTagName对复杂的DOM结构遍历明显不如用childNodes,因为childNodes能更好的处理DOM的层次结构,建议在需要进行了遍历时首先使用childNodes!!

  
但是不幸的是,在IE和FireFox中childNodes有点细微的差别:  
代码如下:

  
  
function view(){  
var childs1=$('FirstDiv').childNodes;  
var childs2=$('SecondDiv').childNodes;  
alert("length of FirstDiv: "+childs1.length+"--length of SecondDiv: "+childs2.length);  
}  
var $=function(id)  
{ return document.getElementById(id); }  
  
  
  
  
  
  
1
  
2
  
3
  
  
  
first
second
third
  
  
  
  
用IE和Firefox运行会有两个不同的结果:IE的结果是3:3;而Firefox则是7:3。怎么会有这种情况呢?

  
在结构上,对象1和对象2不同的是对象1的子节点间有回车或者空格,而对象2则是一行写到尾。大家都应该想到了吧,IE是将一个完整标签作为一个节点。而 Firefox除了上述的的情况外,也把一个标签的结束符“>”到下一个标签的起始符“<”之间的内容(除注释外,包括任何的文字、空格、回车、制表符)也算是一个节点了。而且这种节点也有它们自己独特的属性和值--nodeName="#text"。

  
在实际运用中,Firefox在遍历子节点时,在for循环里不妨加上:  
if(childNode.nodeName=="#text") continue;  
或者nodeType == 1。

  
这样,便跳过不需要的操作,使程序运行的更有效率。

  
附:  
Node.ELEMENT_NODE == 1  
Node.ATTRIBUTE_NODE == 2  
Node.TEXT_NODE == 3  
Node.CDATA_SECTION_NODE == 4  
Node.ENTITY_REFERENCE_NODE == 5  
Node.ENTITY_NODE == 6  
Node.PROCESSING_INSTRUCTION_NODE == 7  
Node.COMMENT_NODE == 8  
Node.DOCUMENT_NODE == 9  
Node.DOCUMENT_TYPE_NODE == 10  
Node.DOCUMENT_FRAGMENT_NODE == 11  
Node.NOTATION_NODE 雅星娱乐注册 == 12  
  
var node = document.documentElement.firstChild;  
if(node.nodeType != Node.COMMENT_NODE)  
alert("You should comment your code well!");

(责任编辑:admin)

推荐图片Related

相关文章Related

查看更多热门新闻


首页 | 特效插件 | 常用代码 | 样式素材 | 脚本代码 | css特效

Copyright © 2017-2018 雅星娱乐 版权所有

系统要求:本站自适应各终端浏览器分辨率

请使用Google、Firefox、IE9、百度浏览器登录网站

网站地图 | RSS订阅 | 雅星娱乐