scrollTop
DOM对象的scrollTop用于获取或者设置一个元素里滚动的距离(垂直)。例如:document.documentElement.scrollTop可以获取当前页面的滚动高度,也可以获取某个DOM元素的滚动距离,例如:document.querySelector('.content').scrollTop,前提是.content元素存在,并且可以滚动。
另外,scrollTop还可以把滚动条移到指定位置,例如:
// 回到顶部
document.documentElement.scrollTop = 0;
offsetTop
DOM对象的offsetTop与scrollTop完全不同,它是上边框相对于父元素上边框的距离,一般是固定的,不随滚动变化。
pageYOffset 和 scrollY
这两个都能返回视窗滚动过的距离,相对来说,pageYOffset兼容性更好,一般我们只用 pageYOffset就行。但两者都不兼容IE9以下,另外 scrollY 可以赋值,让视窗滚动到指定位置。pageYOffser和scrollY都与scrollTop不同,pageYOffset和scrollY都只存在window对象里。
看下面等式:
document.documentElement.scrollTop === window.pageYOffset === scrollY
网友评论