2018-10-11

三大系列：

1. offset系列

offsetLeft | offsetTop
offsetWidth | offsetHeight
offsetParent 定位父级

2. client系列

clientHeight | clientWidth
可视区域的大小，包括元素的本身的宽高以及他的padding。
兼容的获取所有浏览器的可视区域

---

 window.innerHeight ||    高级浏览器
document.documentElement.clientHeight ||  IE
document.body.clientHeight   低版本的Chrome

---

clientTop | clientLeft
上边框或者左边框的宽度
on+resize 窗口大小改变的事件,窗口大小改变的时候就会自动触发。

3.scroll系列

scrollWidth | scrollHeight
onscroll窗口发生滑动的时候自动触发的事件
scrollTop | scrollLeft
窗口滑动过的距离

---

window.pageYOffset ||    高级浏览
document.documentElement.scrollTop ||   IE
document.body.scrollTop;   Chrome低级版本

---

4.document.body 获取页面的body

document.documentElement 获取页面的HTML元素

5.缓冲运动： 可以根据距离目标点的位置修改速度。距离目标越近速度越小。

缓冲运动的速度要进行取整。正值向上取整，负值向下取整。
speed = dest>=0?Math.ceil(dest/10):Math.floor(dest/10);
缓冲运动的停止条件判断是一个严格的值相等。

6.匀速运动的停止条件判断是一个范围。当结束位置距离目标位置的足够近（小于一次运动的距离）的时候就认为已经达到目标位置了。这个时候就可以清除定时器，然后将元素直接设置为目标位置。

 var dest = 400-div.offsetLeft;
speed = dest>=0?7:-7;
Math.abs(div.offsetLeft-400)<Math.abs(speed)

7.querySelectorAll 获取一组元素

8.对象：对象的键是字符串格式的，可以不加引号。

对象的键的值可以是任何数据类型。
json：json是js对象的字符串表达。
json数据的要求非常严格：
键与值必须是使用双引号。
键必须使用双引号。
值只能是数字，字符串，布尔值，数组，json。