首页 > JavaScript 的 nextSibling 在非 IE 输出不了,怎么解决?或者用什么替代?

JavaScript 的 nextSibling 在非 IE 输出不了,怎么解决?或者用什么替代?

带★那句,问题出在那里..

<div id="one">
    <div name="two">
        <div name="aaa">
            1111
        </div>
        <div id="two" name="bbb">
            2222
        </div>

        <div name="ccc">
            3333
        </div>

    </div>
</div>

<script>
        var obj=document.getElementById('two');
        console.log("***"+obj.nextSibling.name); //★★★★★这个在非IE怎么总是输出不了?
        console.log("***"+obj.childNodes[0].nodeValue); //2222
</script>

只要给我改好就行了,我会结合自己慢慢查,要是说理论我能会,我就不问了;
就像 一个老虎 ,你听别人介绍,你也不懂什么是老虎,弄一只老虎让你一看就知道了!


要用nextElementSibling,以及getAttribute方法:

var obj = document.getElementById('two');
if (obj.nextElementSibling) {
    console.log("***" + obj.nextElementSibling.getAttribute("name")); //★★★★★这个在非IE怎么总是输出不了?
} else {
    console.log("***" + obj.nextSibling.name);
}
console.log("***" + obj.childNodes[0].nodeValue); //2222

补充一下,我用的是Chrome浏览器,是不能使用.name获取name属性的:

<div id="one" name="ssas">
</div>
<script>
var o = document.getElementById("one");
console.log(o.name); //undefined
console.log(o.getAttribute("name")); //sass
console.log(navigator.userAgent);
//Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.110 Safari/537.36
</script>

好吧,最后更新一下,找到原因了:因为div、p等元素是没有name属性的,当你加上了name属性的时候,就相当于给他使用setAttribute("name", "blablabla..."),这个时候使用对象obj的属性name(obj.name)是访问不到的,只能使用getAttribute方法。

另外你可以测试一下input标签,当中添加name属性,用obj.name就可以访问。

<input type="text" id="one" name="ssas">
</input>
<script>
var o = document.getElementById("one");
console.log(o.name); //sass
</script>

提示和注释
注释:Internet Explorer 会忽略节点间生成的空白文本节点(例如,换行符号),而 Mozilla 不会这样做。因此,在下面的例子中,我们会使用一个函数来检查首个子节点的节点类型。
元素节点的节点类型是 1,因此如果首个子节点不是一个元素节点,它就会移至下一个节点,然后继续检查此节点是否为元素节点。整个过程会一直持续到首个元素子节点被找到为止。通过这个方法,我们就可以在 Internet Explorer 和 Mozilla 得到正确的方法。
提示:如需更多有关 IE 与 Mozilla 浏览器之间 XML DOM 的差异的内容,请访问我们的 DOM 浏览器 章节。

摘自 :http://www.w3school.com.cn/xmldom/prop_n...


    <script>
            var obj=document.getElementById('two');
            if(obj.nextElementSibling){
                console.log("***"+obj.nextElementSibling.name);
            }else{
                console.log("***"+obj.nextSibling.name);
            }
    </script>
【热门文章】
【热门文章】