IE与FF获取childNodes节点解决方法

最新推荐文章于 2021-05-18 15:44:35 发布
原创 最新推荐文章于 2021-05-18 15:44:35 发布 · 265 阅读 · 0 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
收录于
javascript

当前文章被收录于：

javascript
138 篇文章 0 人学习
订阅专栏 查看详情
本文探讨了在不同浏览器中操作DOM时遇到的兼容性问题，特别是在IE与Firefox中使用childNodes获取子节点的区别。Firefox会将TEXT_NODE类型的节点计入子节点，导致额外的操作。文章提供了两种解决方案：一是通过nodeType进行筛选，二是使用getElementsByTagName方法。
在操作dom遇到问题，使用childNodes取得Div节点的Div子节点，IE浏览器中没有任何问题，而FF浏览器会将TEXT_NODE类型的节点同样计入子节点，这样就会操作到错误的对象。

解决方法两种：

1：通过nodeType对该列表进行了筛选，过滤出ELEMENT_NODE 类型的节点。

2：使用elem.getElementsByTagName("div"); 直接会取得Div下的div类型的标签。

节点类型nodeType：
[img]http://images.51cto.com/files/uploadimg/20100928/1537150.png[/img]
标签
#IE #浏览器
IE与FireFox中的childNodes区别
09-05
Javascript中，相信大家都试过用getElementsByTagName和childNodes来实现对节点的遍历
firefox和ie浏览器下获取childNodes兼容性问题解决
make0739的博客
04-12 444
firefox下面，使用childNodes获取节点，它会将空格符、回车符、换行符也看做一个文本节点， 解决方案： 1.火狐下面要利用nodeType来过滤掉这些无用的节点。 [code="java"]function show(n){ var rows=[]; var one = document.getElementByIdx_x('one_1').parentNode....
【深入JavaScript】DOM中childNodes在IE和非IE浏览器中的区别
weixin_30328063的博客
05-08 174
题外话：这问题遇到好多遍，每次都不记得怎么解决，这次写下来好好提醒自己。 一、问题的出现 　　在写原生Javascript时，我们会经常使用getElementsByTagName()和childNodes来实现对节点的遍历，但是getElementsByTagName()对复杂的DOM结构遍历明显不如用childNodes，因为childNodes能更好的处理DOM的层次结构。 　　但是在...
【前端】通过js获取DOM的childNodes，在IE和Chrome上的区别
姜太小白的博客
05-18 494
IE是将一个完整标签作为一个节点。 Chrome除了将完整标签作为节点之外，把一个标签的结束符“>”到下一个标签的起始符“<”之间的内容（除注释外，包括任何的文字、空格、回车、制表符）也算是一个节点。 这样的话就会导致js获取childNodes在Chrome上会比IE上多。 处理办法：删除这些没用的节点 function delNode(parentNode){ var subNodes = parentNode.childNodes; for(var i = 0;i...
IE和FireFox中的childNodes区别!!
蜜蜂的专栏
11-27 1680
7. childNodes获取的节点   【分析说明】childNodes的下标的含义在IE和Firefox中不同，看一下下面的代码： ul id="main">   li>1li>   li>2li>   li>3li> ul> input type=button value="click me!" onclick= "alert(docum
js.childNodes如何兼容
痕迹
03-12 705
oParent.childNodes是父对象下所有的直系子节点，现代浏览器（IE9及以上和chrome，firefox等）会将空文本节点涵盖，而IE8及以下的IE浏览器不会。为了兼容可以使用oParent.children,不会覆盖文本节点，只会选择元素节点。 oParent.children[0] ===firstElementChild oParent.children[oParent
JS操作html时childNodes的替代方法[兼容IE与FF]
alloyer的专栏
03-05 2942
  JS操作html时childNodes的替代方法[兼容IE与FF] js操作document时，试图使用childNodes取得Div节点的Div子节点，IE浏览器中没有任何问题， 而FF浏览器会将TEXT_NODE类型的节点同样计入子节点，这样就
IE和ff中childNodes不一样
清音无限的专栏
11-10 624
IE和ff中的childNodes实现是有所不同，在对节点的计算上不一样IE会忽略回车和换行，而ff却将回车换行也作为一个节点，比如：     div id="node">     a href="Default.aspx" >aa>     div>1div>        div> div id="node">a href="Default.aspx" >aa>div>1div>div>代
javascript childNodes
tengyang11的专栏
08-10 2100
今天同事问我一个问题，问题是这样的： 有这样的一个table， sss 想通过childNodes获得td的文本。 代码如下：alert(document.getElementById("t_table").childNodes[0].ch
不同浏览器中childNodes获取子节点个数
weixin_30667301的博客
11-02 298
以一段简单的HTML代码为例 <div id="div"> <div id="div01"> 这是div01</div> <div id="div02"> 这是div02</div> </div> childNodes：获取某节点下的所有直接子节点 var node = document.getElementById("d...
兼容IE与FF的childNodes问题（ff childNodes）
weixin_33809981的博客
12-14 145
js操作document时，试图使用childNodes取得Div节点的Div子节点，IE浏览器中没有任何问题， 而FF浏览器会将TEXT_NODE类型的节点同样计入子节点，这样就会操作到错误的对象。 解决方法一般有两种， 一种是使用node的nodeType属性判断结点的类型，然后进行操作。 这种方法意味着，使用var childnodelist=document.getElementById(...
childNodes behavior diffrent in IE & FF
chujiazhen的专栏
09-02 164
IE and FF count in different ways the childNodes. FF (DOM compliant mode) counts even the possible textNodes (the gaps between tags) while IE counts only some of them. To avoid this, use one the so...
IE FF childNodes兼容
weixin_30794491的博客
12-08 113
IE FF childNodes兼容 今天测试childNodes属性的时候，发现IE和FF结果不一样，IE下显示4个节点，而FF下显示9个节点，什么原因呢？原来空格或换行也算一个childNode，暴汗！！！ 1 <div id="div1" onClick="alert(count('div1'))"> 2 &l...
IE7 IE8 IE9 FF的childNodes 区别
weixin_34306593的博客
12-17 177
在做一个取子节点的程序中遇到的一个问题，本来用childNodes是很容易搞定的事情，结果... &lt;div id="mylist"&gt;&lt;li&gt;first&lt;/li&gt;&lt;li&gt;second&lt;/li&gt;&lt;li&gt;third&lt;/li&gt;&lt;/div&gt; &lt;script l
原生JS之lastChild和lastElementChild、childNodes和children区别
骆小胖~
12-22 6388
（1）原生JS遍历时操作如下 childNodes 获取所有子节点（包括包括文本节点、注释节点即回车、换行、空格、文本等等） firstChild 获取第一个子节点（可以为注释节点） lastChild 获取最后一个子节点（与firstChild类似） parentNode 返回给定节点的父级节点 nextSibling 返回给定节点的下一个节点 previousSibling 返回给定节点的上一个节点 注意：上面写法是IE8之前旧版本写法，也可以在I
childNodes在IE与Firefox中的区别
weixin_34117211的博客
01-31 113
嗯，这是前几天写一个遍历双层List集合，动态输出对应的表格并且控制固定表头的效果时发现的一个知识点，程序编好后在IE8浏览器下测试没问题，在Firefox35.0.1总是报错，后来发现是IE与FF对HTML元素中的childNodes属性的“理解”不同造成的，这里记录一下，目的在于让自己记得浏览器中还有许多类似的不兼容性的问题，以后编程的时候需要多加的注意，当然，一步步的调试加上精准的定位问题，...
js下firstElementChild firstChild 以及childNodes和children方法
ClerverCC的博客
12-26 1507
js下firstElementChild firstChild 以及childNodes和children方法 一、 div> p>123p> div> 在上面这段代码中，如果使用以下js代码 var Div=document.getElementByTagName("div")[0]; alert(Div.firstChild.nodeName
浏览器兼容之JavaScript篇——已在IE、FF、Chrome测试
热门推荐
生命不止 学无止境
01-22 1万+
在浏览器兼容性问题解决方法，已在IE、FF、Chrome测试中，已经对关于CSS的一些兼容性问题进行了总结，后来自己又整理了一些关于JS的兼容性问题，现在分享给大家。 1）ChildNodes 问题：     IE7、IE8正常，IE9、IE10、chrome、FF的 childNodes 中会插入空白文本节点 解决：     可以通过document.getElementsByName
如何获取父节点，兄弟节点以及子节点然后遍历
MUHUAAAAAA的博客
01-13 3001
存起来以后看方便 介绍下js获取节点的兄弟、父级与子元素的方法，学习下js遍历节点的操作方法，有需要的朋友参考下。   先说一下JS的获取方法，其要比JQUERY的方法麻烦很多，后面以JQUERY的方法作对比。 JS的方法会比JQUERY麻烦很多，主要则是因为FF浏览器，FF浏览器会把你的换行也当最DOM元素。   复制代码代码示例: 原生的JS获取I
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值