一、获取dom对象
document.querySelector('css选择器')
document.querySelector('.box')
1 选择器匹配第一个元素
如果选择器不存在的 则获取的是null
如果选择器存在,只会获取满足条件的第一个 dom对象
2 获取多个元素,返回的是伪数组 没有pop push 等方法
如果选择器不存在的,获取的是一个空数组
如果选择器存在,获取的的是满足所有条件的 dom对象伪数组
const list = document.querySelectorAll('li')
3 两者的区别
querySelector 获取的是dom对象,可以直接使用dom语法进行操作
querySelectorAll 获取的是伪数组,不可以直接使用dom语法(数组没有语法)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div class="box">青青草原一片天</div>
<div class="box">谁见我懒王不递烟</div>
<ul class="nav">
<li></li>
<li></li>
<li></li>
</ul>
<script>
//获取dom对象
// 1 选择器匹配第一个元素
// 如果选择器不存在的 则获取的是null
// 如果选择