持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第16天
一、DOM 简介
1.什么是 DOM
文档对象模型（Document Object Model，简称 DOM），是 W3C 组织推荐的处理可扩展标记语言（HTML或者XML）的标准编程接口。
W3C 已经定义了一系列的 DOM 接口，通过这些 DOM 接口可以改变网页的内容、结构和样式。
2.DOM 树
文档：一个页面就是一个文档，DOM 中使用 document 表示
元素：页面中的所有标签都是元素，DOM 中使用 element 表示
节点：网页中的所有内容都是节点（标签、属性、文本、注释等），DOM 中使用 node 表示。
DOM 把以上内容都看做是对象
二、获取元素
1.如何获取页面元素
DOM在我们实际开发中主要用来操作元素。我们如何来获取页面中的元素呢?获取页面中的元素可以使用以下几种方式: l 根据 ID 获取
根据标签名获取
通过 HTML5 新增的方法获取
特殊元素获取
2.根据 ID 获取
使用 getElementById() 方法可以获取带有 ID 的元素对象。
document.getElementById('id');
使用 console.dir() 可以打印我们获取的元素对象，更好的查看对象里面的属性和方法。
3.根据标签名获取
使用 getElementsByTagName() 方法可以返回带有指定标签名的对象的集合。
document.getElementsByTagName('标签名');
注意：
1）因为得到的是一个对象的集合，所以我们想要操作里面的元素就需要遍历。
2）得到元素对象是动态的
3）如果获取不到元素,则返回为空的伪数组(因为获取不到对象)
还可以获取某个元素(父元素)内部所有指定标签名的子元素.
element.getElementsByTagName('标签名');
注意：父元素必须是单个对象(必须指明是哪一个元素对象). 获取的时候不包括父元素自己。
4. 通过 HTML5 新增的方法获取
document.getElementsByClassName(‘类名’)；// 根据类名返回元素对象集合
document.querySelector('选择器'); // 根据指定选择器返回第一个元素对象
document.querySelectorAll('选择器'); // 根据指定选择器返回
注意：
querySelector和querySelectorAll里面的选择器需要加符号,比如:document.querySelector('#nav');
5.获取特殊元素（body，html）
获取body元素
doucumnet.body // 返回body元素对象
获取html元素
document.documentElement // 返回html元素对象
