js判断是否滚动到了最底部
理论上判断是否滚动到了最底部的方式
js
element.scrollHeight - element.scrollTop === element.clientHeight
js
element.scrollHeight === element.clientHeight + element.scrollTop
问题描述
要实滚动条触底之后请求接口，继续加载数据实现类似无限加载的效果，但采用上面的判断方式之后，滚动条触底之后并未请求后台接口。
问题原因
scrollTop是一个非整数，而scrollHeight和clientHeight是四舍五入的.因此可能会导致上面的判断公式不成立。
解决方案
解决方案的公式来自 MDN
因此确定滚动区域是否滚动到底的唯一方法是查看滚动量是否足够接近某个阈值（本例中阈值是 1）：
js
Math.abs(element.scrollHeight - element.clientHeight - element.scrollTop) < 1
其实阈值可以设置大一点，毕竟实际开发中，也不用完完全全达到理论上的最底部才请求数据，完全可以在离底部还有一定距离的时候就开始请求后端数据。这样也算是一种体验优化。
之所以找这个问题的答案，是为了确定是不是我代码有问题，导致判定条件不成立。
扩展
判断元素是否能滚动
js
window.getComputedStyle(element).overflowY === 'visible'
window.getComputedStyle(element).overflowY !== 'hidden'