1，document对象
document对象作为Dom树中的根节点（最顶层节点），用于获取和增删节点，没有获取到的返回null。
（属性）方法有
| 属性/方法 | 说明 |
| body | 获取body元素节点 |
| documentElement | 获取html元素节点 |
| title | 读/写当前的title元素内容 |
| write | 清空加载好的文档内容，勿用 |
例子：
//获取网页的html(根)元素
const html= document.documentElement;
//获取网页的body元素
const body=document.body ;
//读取网页标题(即title元素)的内容
const title= document.title;
//用document对象的write()方法向网页输出'其他内容都去哪了'。
document.write('其他内容都去哪了');
//获取到的html元素节点
html.style.background= '#eee';
//获取到的body元素节点
body.style.background= 'white';2，获取单个元素节点（对象）
返回值为元素对象的引用，未找到返回null
| 方法 | 说明 |
| document.getElementById('id属性值') | 返回的id属性为指定值的第一个元素对象 |
| document.querySelector('选择器')/element.querySelector('选择器') | 返回的是元素节点或者后代中和选择器匹配的第1个元素对象 |
例子：
//顺便复习一下css ,嘿嘿
<body>
<h1><a href="#">xx</a></h1>
<div id="j-search">
<form>
<input type="search" id="q" name="q" placeholder="T恤">
<button class="btn-search">搜索</button>
</form>
<nav class="nav">
<ul class="nav-hd">
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
</ul>
<ul class="nav-bd">
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
</nav>
//声明变量inputSearch，赋值为：使用getElementById方法获取id为q的元素,前面有的代码没写哈，直接写重要的
<script>
let inputSearch= document.getElementById('q');
//在赋值符右侧写出：使用querySelector方法获取id为q的元素
inputSearch= document.querySelector('#q');
//在赋值符右侧写出：使用querySelector方法获取name属性为q的元素。可通过任何属性选择器获得元素
inputSearch= document.querySelector('[name="q"]');
//使用querySelector方法获取class为nav-hd的第1个li中的a元素
const tm= document.querySelector('.nav-hd > li > a');
//使用querySelector方法获取class为nav-hd的第2个li中的a元素
const jhs= document.querySelector('.nav-hd > li:nth-child(2) > a');
tm.style.color= '#FF0036'; //改变元素节点的style属性的值
</script>
</body>3，获取多个元素对象的集合
返回集合的引用，未找到空集合
| 属性/方法 | 支持 |
| document(或者element).querySelectorAll('选择器') | 返回元素节点或后代中和选择器匹配的所有元素节点 |
| element.childern | 返回元素节点所有子元素节点组成的集合 |
例子：
<body>
<h1><a href="#">xx</a></h1>
<div class="cart">
<h2>购物车（全部2）</h2>
<div><input type="checkbox" class="select-all">全选</div>
<ul class="order">
<li><input type="checkbox">1</li>
<li><input type="checkbox">2</li>
</ul>
</div>
<script>
//使用querySelectorAll方法获取class为order的元素里的所有复选框元素
let orderCheckboxs= document.querySelectorAll('.order>li>[type=checkbox]');
</script>
</body>