[原] IE和Firefox在DOM解析childNodes上的不同
Posted by bianbian on 2006-09-07 18:25
本文Tags: childNodes, Firefox, IE
一个问题困扰我，涉及到firstChild和lastChild的代码工作不正常。为了简单，我把问题抽象到下面这个代码，你猜点击按钮后的结果是什么？
- <html><body>
- <UL id="main">
- <LI>1</LI>
- <LI>2</LI>
- </UL>
- <input type=button value="click me!"
- onclick="alert(document.getElementById('main').childNodes.length)">
- </body></html>
呵呵，在IE里提示2，在Firefox里提示5，这是怎么回事呢？UL下明明只有两个子节点，Firefox为什么提示5个子节点呢？通过查看IE和firefox的DOM结构，发现了问题的所在：
IE:
Firefox:
你也应该发现了吧？“#text”表示文本（实际是无意义的空格和换行等）在Firefox里也会被解析成一个节点，在IE里只有有实际意义的文本才会解析成“#text”。所以对firefox而言，上例中UL的fistChild并不是第一个LI，而是#text（UL和第一个LI之间的无意义文本），lastChild也并不是最后一个LI，而是最后一个LI和/UL之间的无意义文本。
解决办法是先用 .getElementsByTagName(”LI”) 得到所有LI的节点。我觉得firefox这样处理比较令程序员头痛，也没有必要。
标签: childNodes, Firefox, IE遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道
March 20th, 2007 at 04:16:38
不错！谢谢博主！解决了我一个大问题！
October 3rd, 2007 at 10:29:16
很感谢,这个问题的确很莫名,谢谢指教。
April 5th, 2008 at 07:17:34
我也发现这个问题了
我用Cobra解析HTML文档，发现解析出来的DOM树和Firefox的不一样。
唉唉。。。
就这样用吧
另外我比较好奇Firefox的DOM Inspector上的一个功能，就是点击网页，自动定位到DOM树的节点，不知道怎么实现的。
刚接触DOM不久，不知道您能不能给我解惑。
我用的java做项目。