javascript节点遍历方法总结

最新推荐文章于 2023-10-13 10:39:41 发布

紫菜菌

最新推荐文章于 2023-10-13 10:39:41 发布

阅读量666

点赞数 2

分类专栏： js基础文章标签：前端 javascript 节点遍历

本文链接：https://blog.csdn.net/caiyyu/article/details/93789227

版权

本文总结了JavaScript中关于节点遍历的各种方法，包括DOM遍历的相关操作，帮助理解如何在前端开发中有效地操作和遍历DOM节点。具体内容涉及不同遍历策略及其应用，适合前端开发者参考学习。

摘要由CSDN通过智能技术生成

如题所示：

<body>
    <div>
        <ul>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </div>
    <script>
        var div =document.getElementsByTagName("div")[0];
        //console.log(div.childNodes);子节点 包含元素，换行，注释
        //console.log(div.children);子元素 只获取标签
        //console.log(div.parentNode);父节点
       // console.log(div.parentElement);父元素
       //console.log(div.firstChild.firstChild);第一个子节点
       //console.log(div.firstElementChild);第一个子元素
       //console.log(div.lastChild);最后一个子节点
       //console.log(div.lastElementChild);最后一个子元素
       //console.log(div.previousSibling);上一个兄弟节点
       //console.log(div.previousElementSibling);上一个兄弟元素
       //console.log(div.nextSibling);下一个兄弟节点
       console.log(div.nextElementSibling);
       //