[原] IE和Firefox在DOM解析childNodes上的不同

一个问题困扰我,涉及到firstChild和lastChild的代码工作不正常。为了简单,我把问题抽象到下面这个代码,你猜点击按钮后的结果是什么?

呵呵,在IE里提示2,在Firefox里提示5,这是怎么回事呢?UL下明明只有两个子节点,Firefox为什么提示5个子节点呢?通过查看IE和firefox的DOM结构,发现了问题的所在:
IE:IE Firefox:firefox
你也应该发现了吧?“#text”表示文本(实际是无意义的空格和换行等)在Firefox里也会被解析成一个节点,在IE里只有有实际意义的文本才会解析成“#text”。所以对firefox而言,上例中UL的fistChild并不是第一个LI,而是#text(UL和第一个LI之间的无意义文本),lastChild也并不是最后一个LI,而是最后一个LI和/UL之间的无意义文本。

解决办法是先用 .getElementsByTagName(“LI”) 得到所有LI的节点。我觉得firefox这样处理比较令程序员头痛,也没有必要。

[原] IE和Firefox在DOM解析childNodes上的不同》上有5条评论

  1. ots.nixius

    我也发现这个问题了
    我用Cobra解析HTML文档,发现解析出来的DOM树和Firefox的不一样。
    唉唉。。。
    就这样用吧

    另外我比较好奇Firefox的DOM Inspector上的一个功能,就是点击网页,自动定位到DOM树的节点,不知道怎么实现的。
    刚接触DOM不久,不知道您能不能给我解惑。
    我用的java做项目。

发表评论