1、获取元素：
class 值的获取方式：
className: 获取元素 class 属性值
//注 ： class 是 js 的关键字，规范化，不能将其做为属性的名字
getElementById:通过 ID 值获取 dom 对象，返回 html 元素对象，
参数： 字符串，表示 ID 属性的赋值
getElementByClassName: 通过元素标签名字，获取 DOM 元素对象，返回类数组，
参数： 字符串，表示元素名字
getElementByTagName : 通过标签名获取 html 元素
//注 ： getElement... 没有 s ，返回的都是 DOM 对象
getElements ... 返回的都是类数组
querySelector() , 返回 DOM 对象，不是数组，
参数： css 选择器
querySelectorAll()， 返回类数组，参数 ： css 选择器
2、节点操作
1) createElement() 创建 dom 节点，返回新建的 dom 对象
注意： js 创建的，如果不添加到页面中，页面中是不存在的；
2）appendChild： 添加为父元素的最后一个子节点，并返回添加的子节点
注意：如果是新增元素，需要先创建再添加
3) innerHTML :
~~ dom.innerHTML 返回 dom 中所有子代的字符串，重新赋值
~~ 在原有的基础上新增
4) innerText : 赋值内容，类型为字符串，重新赋值，不适合新增操作
// 注 ： 以上两者应用差不多，初始化返回，innerHTML 中包括 html 字符串，而 innerText 没有，建议使用 innerHEML;
5) getcomputedStyle(dom,null).css属性
返回对象，全局 css 样式
参一： dom 对象；
参二： 是否返回伪类样式；
3、节点的方法：
1) nodeType ： 节点查询，返回的对象，是否可以使用 DOM 下的 API，返回值可能是 text 、dom 、attr
2) nodeName： 元素的标签名，以大写形式表示
3）nodeValue ： text 节点 或 comment 节点的文本内容
4) parentNodes：父节点（最顶端的 parentnode 为 #document）
5）parentElement：返回当前元素的父节点
6）children ：子节点，只返回当前元素的元素子节点
7）firstChild ： 第一个子节点
8） lastChild：最后一个子节点
9） nextSibling ：下一个兄弟节点
10）previoussibling ：上一个兄弟节点
4、DOM 基本操作
1、查看滚动条的滚动距离：
window.pageXoffset/pageYoffset
document.body/documentElement.scrollLeft/Scrolltop(这两个兼容性比较差，用的时候同时取两个值相加，因为不可能存在两个同时有值)
2、查看视口尺寸：
window.innerWidth/innerHeight
document.documentElement.clientWidth/clientHeight //标准模式下，任意浏览器都兼容
document.body.clientWidth/clientHeight //适用于怪异模式下的浏览器
3、查看元素的几何尺寸
document.getBoundingClientRect();
兼容性好，该方法返回一个对象，对象里面有 left，top，right，bottom 等属性。 left 和 top 代表该元素左上角的 x 和 y 坐标，right 和bottom 代表右下角的 x 和 y 坐标
4、让滚动条滚动
window 上有三个方法
scroll() ， scrollTo() ，scrollBy()
三个方法功能类似，用法都是将 x，y 坐标传入。即实现让滚动条滚动到当前位置。
区别： scrollBy() 会在之前的数据基础之上做累加。
eg： 利用 scrollBy() 快速阅读的功能
5、查看元素的尺寸
dom.offsetWidth
dom.offsetHeight
查看元素的位置
dom.offsetLeft
dom.offsetTop
对于屋顶为父级的元素，返回相对文档的坐标，对于返回相对于最近的有定位的父级的坐标
dom.offsetParent
返回最近的有定位的父级，如无，则返回body，body.offsetParent
6、让滚动条滚动
window 上有三个方法
scroll() 、 scrollTo() 、 scrollBy()
三个方法功能类似， 用法都是将 X、Y 坐标传入，即实现让滚动轮滚动到当前位置
区别： scrollby() 会在之前的基础上做累加
