遍历DOM树元素

最新推荐文章于 2024-03-28 11:50:25 发布

空巷挽清风

最新推荐文章于 2024-03-28 11:50:25 发布

阅读量220

点赞数 1

分类专栏： JS HTML CSS 文章标签： DOM树递归遍历 DOM

本文链接：https://blog.csdn.net/Kong_xiang/article/details/95349613

版权

HTML 同时被 3 个专栏收录

11 篇文章 0 订阅

订阅专栏

CSS

10 篇文章 0 订阅

订阅专栏

4 篇文章 0 订阅

订阅专栏

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h1>遍历 DOM 树</h1>
    <p style="color: green;">Tip: 可以在遍历的回调函数中任意定制需求</p>
    <div>
    <ul>
        <li>123</li>
        <li>456</li>
        <li>789</li>
    </ul>
    <div>
       <div>
          <span>haha</span>
        </div>
    </div>
    </div>
    <div id="demo_node">
    <ul>
        <li>123</li>
    </ul>
    <p>hello</p>
    <h2>world</h2>
    <div>
        <p>dsa</p>
        <h3>
            <span>dsads</span>
        </h3>
    </div>
</div>

<script>
    var root=document.documentElement;  //console.log(root.nodeName);
    function Dom(root){
        console.log(root.nodeName);
        var children = root.children;  
        for(var i=0;i<children.length;i++){ 
            Dom(children[i]);
        }
    }
    Dom(root);
</script>
</body>
</html>

空巷挽清风

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
遍历DOM树元素

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <h1>遍历 DOM 树</h1> ...
复制链接

扫一扫