老师,帮解释一下,被自己写的代码绕进去了

来源:3-13 封装节点关系函数

慕尼黑1646658

2023-07-13 15:41:26

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>dom</title>
</head>

<body>

    <div id="box">
        <p>我是段落A</p>
        <p>我是段落2</p>
        <p>我是段落3</p>
        我是文本
        我是文本
        <p id="para">我是段落B</p>
        <p>我是段落C</p>
        <p>我是段落4</p>
        <p>我是段落5</p>
    </div>
    <script>
        var box = document.getElementById('box');
        var para = document.getElementById('para');
     

        //封装第二个函数,这个函数可以返回这个元素前一个兄弟元素节点(兼容到IE6),类似previousElementSubling的功能
        function getElementPre(node){
            console.log(node.previousSibling)
            var  o = node;
            while(o.previousSibling.nodeType != 1){
               o = node.previousSibling;
               if(o.previousSibling == null){
                return null
               }
            }
            return o.previousSibling

        }
      console.log(getElementPre(para))  




    </script>


</body>

</html>

https://img.mukewang.com/climg/64afaa7a09926d6507120461.jpg

写回答

1回答

好帮手慕久久

2023-07-13

同学你好,同学的结构比较特殊,所以赶巧了,导致看上去结果是对的。代码中,如下写法,被浏览器当成了一个节点:

https://img.mukewang.com/climg/64afad2d090435b605530368.jpg

所以最终的结果是对的。

同学添加一个注释节点,代码结果就不对了,比如:

https://img.mukewang.com/climg/64afaf0b091b00ba05260357.jpg

祝学习愉快!

0

0 学习 · 17877 问题

查看课程