當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
JavaScript-操作DOM对象-获得dom节点
生活随笔
收集整理的這篇文章主要介紹了
JavaScript-操作DOM对象-获得dom节点
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
核心
瀏覽器網頁就是一個Dom樹形結構！
- 更新： 更新Dom節點
- 遍歷dom節點：得到Dom節點
- 刪除： 刪除一個Dom節點
- 添加： 添加一個新的節點
要操作一個Dom節點，就必須要先獲得這個Dom節點
獲得dom節點
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title> </head> <body> <div id="father"><h1>標題1</h1><h1>標題2</h1><p id="p1">p1</p><p class="p2">p2</p> </div> <script>// 對應css 選擇器let h1 = document.getElementsByTagName('h1')let p1 = document.getElementById('p1')let p2 = document.getElementsByClassName('p2')let father = document.getElementById('father')console.log(h1)console.log(p1)console.log(p2)console.log(father)// 獲取父節點下的所有子節點let childrens = father.childrenconsole.log(childrens)// 獲取父節點的第一個子節點console.log(father.firstChild)console.log(father.firstElementChild)// 獲取父節點的最后一個子節點console.log(father.lastChild)console.log(father.lastElementChild) </script> </body> </html>https://www.bilibili.com/video/BV1JJ41177di?p=20
總結
以上是生活随笔為你收集整理的JavaScript-操作DOM对象-获得dom节点的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 小程序开发(9)-之地图组件map、导航
- 下一篇： JavaScript-引入JavaScr