建站学 - 轻松建站从此开始!

建站学-个人建站指南,网页制作,网站设计,网站制作教程

HTML DOM节点在不同浏览器中的识别差异

时间:2011-03-30 14:41来源: 作者: 点击:
我们来了解下HTML DOM节点在不同浏览器中的识别差异。在IE浏览器及其它浏览器下对于HTML DOM的识别并非任何情况下都是一致的,主要是IE和非IE两个阵营的表现异同。   如有以下这样一段代码:
 

文字

  <
我们来了解下HTML DOM节点在不同浏览器中的识别差异。在IE浏览器及其它浏览器下对于HTML DOM的识别并非任何情况下都是一致的,主要是IE和非IE两个阵营的表现异同。

  如有以下这样一段代码:

<div id="test">
  <p>文字</p>
  <p>文字</p>
  <p>文字</p>
</div>

  单从HTML结构表象来看,ID test 一共有3个P元素子节点。其实,在IE下,这种表象就是实质,而在非IE下,表象的外衣将顷刻被撕开。

  为了看出这种区别,我们可以遍历test的子节点,并将其节点个数及节点类型都打印出来:

<script type="text/javascript">
var x = document.getElementById("test");
var xc = x.childNodes;
var xcl = xc.length;
for(var i=0;i<xcl;i++){
  document.write("nodeName = " + xc[i].nodeName + "; nodeType = " + xc[i].nodeType + "<br />");
</script>

  IE的打印结果为:

nodeName = P; nodeType = 1
nodeName = P; nodeType = 1
nodeName = P; nodeType = 1

  非IE的打印结果为:

nodeName = #text; nodeType = 3
nodeName = P; nodeType = 1
nodeName = #text; nodeType = 3
nodeName = P; nodeType = 1
nodeName = #text; nodeType = 3
nodeName = P; nodeType = 1
nodeName = #text; nodeType = 3

  显而易见,IE的打印结果和我们所说的表象一样:有3个子节点,并且都为P元素;而非IE则表现出极大的差异:居然打印出了7个子节点,当然也包括3个P元素子节点在内,除此之外还多了4个nodeType=3的子节点,我们都知道节点类型为3的节点属于文本节点,但从那段HTML中可以看P与P之间并无其它的内容出现,那这4个文本节点是怎样凭空出现的呢?

  在这种情况下,唯一有可能的原因就是在HTML的书写上,因为这段HTML并不是连续的书写,而是每个节点间都用回车换行了,并且正好出现了4次换行,也许非IE把换行也当成了一个节点。

(责任编辑:admin)

织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片