获取DOM元素

查找DOM元素就是利用 JS 选择页面中标签元素

根据CSS选择器来获取DOM元素 (重点)

选择匹配的第一个元素

// document.querySelector('css选择器')
document.querySelector('div')
document.querySelector('.box')

• 参数：
  • 包含一个或多个有效的CSS选择器 字符串
• 返回值：
  • CSS选择器匹配的第一个元素,一个 HTMLElement对象。
  • 如果没有匹配到，则返回null

参考文档：document.querySelector()

选择匹配多个元素

// document.querySelectorAll('css选择器')
document.querySelector('ul li')

• 参数:
  • 包含一个或多个有效的CSS选择器 字符串
• 返回值：
  • CSS选择器匹配的NodeList 对象集合

document.querySelectorAll('css选择器') 得到的是一个伪数组

哪怕只有一个元素，通过querySelectAll()获取过来的也是一个伪数组，里面只有一个元素而已

• 伪数组：
  • 有长度 有索引号的数组
  • 但是没有pop()、push()数组方法
  • 想要得到里面的每一个对象，需要遍历的方式获得

其他获取DOM元素方法（了解）

// 根据 id 获取一个元素
document.getElementById('nav')

// 根据 标签 获取一类元素
document.getElementsByTagName('div')

// 根据 类名 获取元素 获取页面所有类名为 w 的元素
document.getElementsByClassName('w')