关于scrollHeight、scrollTop、clientHeight的总结
作者：互联网
对于这三个css属性，首先有两点是需要注意的：
scrollHeight、clientHeight只可读不可写，scrollTop可读可写。
他们都是用在滚动列表的外层元素上的。
在实际应用中有两个场景会经常用到这三个属性，下面分两个大方向来分别介绍：
判断滚动是否到底
1.scrollHeight：
描述：包括overflow样式属性导致的视图中不可见内容的高度（单位像素），包括元素的padding，但不包括元素的margin.
2.clientHeight：
描述：返回元素内部的高度(单位像素)，包含内边距，但不包括水平滚动条、边框和外边距。
3.scrollTop：
描述：当前容器上边框内部距离他内部的滚动元素上边框的距离。
所以从以上三个概念可以得出，判断内部元素滚动是否到底的表达式是：
scrollHeight - scrollTop === clientHeight
如果表达式为true，则表示已经滚动到底部。如果为false，表示没有滚动到底部。
将滚动内容重新置顶
由于scrollTop是可写的，而且表示容器上边框内部距滚动元素上边框内部的垂直距离，只要把scrollTop设成0，即可让内部滚动元素重新置顶。
参考：
https://blog.csdn.net/caseywei/article/details/92644503
https://www.cnblogs.com/wenruo/p/9754576.html
对于出入职场的你想知道行业内技术水平如何么？遇到的技术点有没有由于长期没有再接触容易忘记呢？『全栈编程』刷题小程序就是专门来解决上述两个问题的，其中题目全部出自一线大厂小哥的工作实践，每月刷题最多的同学可以任选100元以内图书一本哦~
标签：滚动,元素,clientHeight,边框,scrollTop,scrollHeight 来源： https://blog.51cto.com/u_15127544/2699631