JS 窗口滚动条理解

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/for_cxc/article/details/52052288

首先    window.innerHeight  表示浏览器可见或可用高度

如果body中的元素总高度超越上面的高度，默认body会出现滚动条 

那么 document.body.scrollHeight  就表示 所有元素总高度     它当然大于 window.innerHeight

还有 document.body.scrollTop 就表示 当前页面相对于总高度的位置，有的文档也说它是滚动条的位置。

上面的话还有点抽象，下面用数据表示

假设 window.innerHeight  窗口可见高度为 600px

document.body.scrollHeight  所有元素总高度为900px 

那么 就会出现滚动条

document.body.scrollTop  的范围 为 0 - 300

当滚动条位于 最顶端 未滑动时 document.body.scrollTop 的值为 0 

当滚动条位于 最底端时 document.body.scrollTop 的值为 300 

完美！