29-js中的几种API获取

1. document文档
2. document 文档
3. Element 对象
4. client 客户端
5. offset 偏移
6. scroll 溢出

offset scroll client 三者之间的区别

1. offset 获取一个元素在整个文档中的位置信息

dom.offsetHeight
dom.offsetWidth
//获取的是元素的实际宽高 = width + border + padding
dom.offsetTop
dom.offsetLeft
//获取元素的位置信息 如果父元素有定位属性的话得到是距离它父元素的位置 如父级没有定位属性则是得到距离body的距离

2. scroll 元素滚动条的位置

dom.scrollHeight
dom.scrollWidth
//获取元素自身的宽度去除边框某种意义上和clientHeight一样
scrollTop
//一个方法主要是得到文档超出窗口的部分 dom对像没有效果
 获取滚动条距离顶部的位置
语法格式：
var scrollHeight = document.documenElement.scrollTop
 设置滚动条的位置
1. window.scrollTo(x轴， Y轴)
2. 设置滚动条的滑动的方式
window.scrollTo({
    top:  ,   //设置滚动条的位置
    behavior:"smooth", //滚动条的的滑动形式 
})
//需要配和onscroll事件一起使用

3. client 获取一个元素的大小

dom.clientHeight
dom.clientWidth
//获取元素自身的宽度去除边框某种意义上和scrollHeight一样
dom.clientTop
dom.clientLeft
获取元素边框的宽高

获取窗口大小的API

语法格式：
变量 = document.documentElement.clientHeight
变量 = document.documentElement.clientWifht
变量 = innerWidth
变量 = innerHeigth
两种方法都是可以获取窗口的宽高

获取一个对象位置信息的语法格式：

var number= DOM.getBoundingClientRect().方法

/*    .top：元素上边到视窗上边的距离;
	.right：元素右边到视窗左边的距离;
	.bottom：元素下边到视窗上边的距离;
	.left：元素左边到视窗左边的距离;
	.width：是元素自身的宽
	.height是元素自身的高
*/
获取一个元素距离窗口的距离信息

---

公式

触底加载的计算公式：
滚动条划出的部分+窗口的高度=整个文档的高度

楼层导航的计算公式：
滚动条划出的部分+窗口的高度=元素距离顶部的距离