日韩av黄I国产麻豆传媒I国产91av视频在线观看I日韩一区二区三区在线看I美女国产在线I麻豆视频国产在线观看I成人黄色短片

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 >

DOM 节点类型及属性

發布時間:2025/3/12 17 豆豆
生活随笔 收集整理的這篇文章主要介紹了 DOM 节点类型及属性 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

一、節點類型

節點名稱節點類型節點文本內容
#document (文檔節點)9null
大寫標簽名 (元素節點)1null
#text (文本節點 )3文本內容
#comment (注釋節點)8注釋的內容

二、獲取節點的方式

childNodes ? 獲取所有子節點

document.body.childNodes

children ? 獲取所有元素子節點

document.body.children

parentNode ? 獲取當前節點的父節點

document.body.parentNode

previousSibling ? 獲取當前節點的上一個兄弟節點

document.body.previousSibling

perviousElementSibling ? 獲取當前節點的上一個兄弟元素節點

document.body.perviousElementSibling

nextSibling ? 獲取當前節點的下一個兄弟節點

document.body.nextSibling

nextElementSibling ? 獲取當前節點的下一個兄弟元素節點

document.body.nextElementSibling

firstChild ? 獲取第一個子節點

document.body.nextElementSibling

firstElementChild ? 獲取第一個元素子節點

document.body.firstElementChild

lastChild ? 獲取最后一個子節點

document.body.lastChild

lastElementChild ? 獲取最后一個元素子節點

document.body.lastElementChild

offsetParent ? 獲取定位父節點,默認默認以 body 標簽為定位父節點,如果為 fixed ,結果為 null

document.body.offsetParent <style>p {position: relative}span {position: fixed} </style> <body><div><span></span><p><a href="http://www.baidu.com">百度一下</a></p></div> </body> <script>const div = document.querySelector('div');const span = document.querySelector('span');const a = document.querySelector('a');console.log(div.offsetParent); // bodyconsole.log(span.offsetParent); // null --> 固定定位的父級不知道用什么表示,所以就是nullconsole.log(a.offsetParent); // p --> 因為a的父級p加了定位 </script>

總結

以上是生活随笔為你收集整理的DOM 节点类型及属性的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。