《JavaScript高级程序设计（第3版）》学习笔记41：chapter

本文链接：https://blog.csdn.net/weixin_44582681/article/details/101126638

让学习“上瘾”，成为更好的自己！！！

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>元素遍历</title>
   
</head>

<body>
    <div id="myDiv">
        <p>fjaldjlfa <a href="">我们是一家</a></p> <br>
        <span>spma</span>
    </div>



    <script>
        /*
            元素遍历API为DOM元素添加了5个属性：
             （1）childElementCount: 返回子元素（不包括文本节点和注释）的个数
             （2）firstElementChild: 指向第一个子元素
             （3）lastElementChild:  指向最后一个子元素
             （4）previousElementSibling: 指向前一个同辈元素
             （5）nextElementSibling: 指向后一个同辈元素
            
            // 利用以上的属性不必担心空白文本节点，从而可以更方便地查找DOM元素

            
            
            
            */

        // 遍历某元素的所有子元素
        
        // var i,
        //     len, 
        //     child = element.firstElementChild;
        // while(child != element.lastElementChild){
        //     processChild(child);
        //     child = child.nextElementSibling;
        // }

        var div = document.getElementById('myDiv');
        console.log(div.firstElementChild);
        console.log(div.firstChild);  // 空白文本
        console.log(div.firstElementChild === div.firstChild);
        
        



            
    </script>
</body>

</html>