【JavaScript】39_DOM编程：div的原型链

名之以父

于 2023-03-15 17:42:10 发布

阅读量242

点赞数

分类专栏： JavaScript 文章标签： javascript 前端 html ecmascript node.js

本文链接：https://blog.csdn.net/wujianrenn/article/details/129562237

版权

JavaScript 专栏收录该内容

45 篇文章 1 订阅

订阅专栏

4、div元素的原型链

HTMLDivElement -> HTMLElement -> Element -> Node -> …

通过元素节点对象获取其他节点的方法

element.childNodes 获取当前元素的子节点（会包含空白的子节点）

element.children 获取当前元素的子元素

element.firstElementChild 获取当前元素的第一个子元素

element.lastElementChild 获取当前元素的最后一个子元素

element.nextElementSibling 获取当前元素的下一个兄弟元素

element.previousElementSibling 获取当前元素的前一个兄弟元素

element.parentNode 获取当前元素的父节点

element.tagName 获取当前元素的标签名

 <body>
     <div id="box1">
         我是box1
         <span class="s1">我是s1</span>
         <span class="s1">我是s1</span>
     </div>
 
     <span class="s1">我是s1</span>
 
     <script>
             const box1 = document.getElementById('box1')
             const spans = box1.getElementsByTagName('span')
             const span2 = box1.getElementsByClassName('s1')
             const cns = box1.childNodes
             const children = box1.children
             console.log(children.length)//2,两个span标签
     </script>
 </body>

名之以父

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
【JavaScript】39_DOM编程：div的原型链

element.previousElementSibling 获取当前元素的前一个兄弟元素。element.nextElementSibling 获取当前元素的下一个兄弟元素。element.childNodes 获取当前元素的子节点（会包含空白的子节点）element.firstElementChild 获取当前元素的第一个子元素。element.lastElementChild 获取当前元素的最后一个子元素。element.children 获取当前元素的子元素。通过元素节点对象获取其他节点的方法。
复制链接

扫一扫