为了账号安全,请及时绑定邮箱和手机立即绑定

网页中,childNodes到底是什么,节点包含 什么,哪位大神给我具体讲讲

网页中,childNodes到底是什么,节点包含 什么,哪位大神给我具体讲讲

qq_小盛开_0 2016-10-10 20:24:05
查看完整描述

2 回答

已采纳
?
善始者实凡

TA贡献1条经验 获得超0个赞

首先要了解什么是node,节点的分类:元素节点、文本节点、等等 。 然后了解节点树。

查看完整回答
反对 回复 2016-10-11
?
GavinZeng

TA贡献31条经验 获得超20个赞

Q1. childNodes到底是什么?

    childNodes 直译意思就是子元素节点

Q2. 节点包含什么?

    当JS使用childNodes获取子元素节点时,获取的内容是包含了父元素下的所有子元素集合的列表,是一个数组对象。

    即,多个元素组成的数组对象。

例子代码:

<div id="testEle">
    <div>div元素</div>
    <p>p元素<span>span元素</span></p>
    <input type="text" value="input元素">
    11111111
</div>
<script>
    var testChildEle = document.getElementById('testEle').childNodes;
    var Num = testChildEle.length;
    console.log('div的子节点数量为:'+ Num);
    for(var i=0;i<Num;i++){
        console.log('节点序号:'+(i+1));
        console.log('节点类型:'+testChildEle[i].nodeType);
        console.log('节点名称:'+testChildEle[i].nodeName);
    }
</script>

说明:

不同浏览器对childNodes获取的节点有不同解释,以上代码在IE和Chrome、Firefox浏览器中,会得到不同的结果。

另外,不同的书写方式在相同浏览器中也会得到不同的结果,如把上面的HTML结构修改如下:

<div id="testEle">
    <div>div元素</div><p>p元素<span>span元素</span></p><input type="text" value="input元素">11111111
</div>

和上面的例子看起来只是修改了断行,并没有实质性的改变,但在Chrome中输出结果却发生了改变。

建议:

由于childNodes的兼容性问题,同时可以替代该方法的实现方式有很多,所以实际应用中,比较少使用了。

查看完整回答
1 反对 回复 2016-10-11
  • 2 回答
  • 0 关注
  • 2646 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信