获取父元素节点和子节元素节点，以及通过下标获取子元素节点

最新推荐文章于 2024-07-11 16:50:01 发布

橙子斌

最新推荐文章于 2024-07-11 16:50:01 发布

阅读量673

点赞数

分类专栏： JavaScript基础文章标签： javascript

本文链接：https://blog.csdn.net/weixin_49833951/article/details/113644112

版权

JavaScript基础专栏收录该内容

3 篇文章 0 订阅

订阅专栏

获取父元素节点：

<script>
        // 先获取子元素
        var zi = document.querySelector('zi');
        // 再通过parentNode获取父节点
        // 得到的是元素最近的父节点，如果找不到返回null
        console.log(zi.parentNode);
    </script>

获取子元素节点：

<script>
        // 先获取父元素
        var fu = document.querySelector('fu');
        // children 获取所有子元素节点 也是我们实际开发常用的
        console.log(fu.children);
    </script>

通过下标获取子元素节点：

<body>
    <ul>
        <li>我的是lis1</li>
        <li>我是lis2</li>
        <li>我是lis3</li>
        <li>我是lis4</li>
        <li>我是lis5</li>
    </ul>
    <script>
        // 先获取ul元素
        var ul = document.querySelector('ul');
        // 使用 children[]获取第一个li元素
        console.log(ul.children[0]);
        // 使用 children[]获取最后一个li元素
        console.log(ul.children[ul.children.length - 1]);
        // 使用 children[2]下标获取最后三个li元素
        console.log(ul.children[2]);
    </script>
</body>

橙子斌

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
获取父元素节点和子节元素节点，以及通过下标获取子元素节点

获取父元素节点：<script> // 先获取子元素 var zi = document.querySelector('zi'); // 再通过parentNode获取父节点 // 得到的是元素最近的父节点，如果找不到返回null console.log(zi.parentNode); </script>获取子元素节点：<script> // 先获取父元素
复制链接

扫一扫