2021-09-17-offset、client、scroll

页面元素位置

1、视口大小（可以看见的网页大小）–-client

//当前可以看见的浏览器大小
console.log(document.documentElement.clientWidth,document.documentElement.clientHeight)

2、网页大小（包括滚动条之下看不见的）—scroll

//浏览器总大小：包括卷曲的页面
console.log(document.documentElement.scrollWidth,document.documentElement.scrollHeight)

3、元素绝对位置—offset轮询

//元素左上角相对页面的绝对位置：即也算上了卷曲的。
（思路就是自己相对于父元素的距离，层层往上，直到到了最上。）
function getEleLeft(element){
	var nowDis = element.offsetLeft
	var par = element.offsetParent
	//只要还有父元素就一直往上+
	while(par !== null){
		nowDis += par.offsetLeft
		par = par.ofsetParent
	}
	return nowDis
}

4、元素相对位置—绝对 - scroll

//元素左上角相对页面的相对位置：即不算卷曲的。
console.log(getEleLeft(element) - document.documentElement.scrollLeft)