獲取頁面元素的四種方法
阿新 • • 發佈:2018-12-20
測試原始碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <h2 id="header">前端開發學習</h2> <ul class="list"> <li>HTML5</li> <li>CSS3</li> <li>JavaScript</li> </ul> </body> </html>
1.用標籤名來獲取元素
獲取頁面中全部的 li 元素
引數為標籤名
以陣列形式儲存
訪問元素內容
修改元素內容
2.用元素 id 來獲取 var h2 = document.getElementById('header')
引數為id內容
以文字形式儲存
訪問元素內容
修改元素內容
3.用 class 類名來獲取元素 var ul = document.getElementsByClassName('list')
返回一個數組,類屬性list進行修飾的一個物件
引數為clss屬性值
訪問元素內容
4.用 CSS 選擇符來獲取 var li = document.querySelector('li') var li = document.querySelectorAll('li')
只能獲取一個元素內容
使用 querySelectorAll 可獲取多個內容
訪問元素內容
修改元素內容