原生js——获取滚动条的高度

浏览器获取滚动条高度的方法

浏览器	API
IE6/7/8	document.documentElement.scrollTop
IE9及以上	window.pageYOffset 或者 document.documentElement.scrollTop
Safari	window.pageYOffset或者document.body.scrollTop
Firefox	window.pageYOffset 或者 document.documentElement.scrollTop
Chrome	document.documentElement.scrollTop

备注

• 很多技术博客上面说Chrome只能使用document.body.scrollTop来获取滚动条的高度。
• 但是我在测试的时候发现，Chrome不能使用document.body.scrollTop，只能使用document.documentElement.scrollTop来获取滚动条的高度。
• 如果使用document.body.scrollTop，那么所获得的数值始终是0。
• 不过大家不用国语在意这一点，我们直接封装一个函数来获取滚动条的高度即可。

封装获取滚动条高度的函数

function getScrollTop() {
    var scroll_top = 0;
    if (document.documentElement && document.documentElement.scrollTop) {
        scroll_top = document.documentElement.scrollTop;
    }
    else if (document.body) {
        scroll_top = document.body.scrollTop;
    }
    return scroll_top;
}