今天小编跟大家讲解下有关H5中滚动到底部的事件 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关H5中滚动到底部的事件 的相关资料，希望小伙伴们看了有所帮助。
问题：
在H5中，我们有这样的需求：例如有列表的时候，滚动到底部时，需要加载更多。
解决方案：
可以采用window的滚动事件进行处理
分析：
如果滚动是针对整个屏幕而言的（不针对于某个界面小块），那么这个应该是是成立的：屏幕的高度+最大滚动的距离 = 内容的高度
代码实现：
<html><head><meta charset="UTF-8"><title>监听滚动到底部滚动底部</title><style>.div2 {width: 100px;height: 100px;border: 1px solid red}* {margin: 0}.button1:active {background: red}body {height: 375px;width: 667px;border: 1px solid red}.div1 {height: 600px;width: 100%;background: red}.div2 {height: 600px;width: 100%;background: green}.div3 {height: 600px;width: 100%;background: blue}.div4 {height: 600px;width: 100%;background: yellow}</style></head><body><div class="div0"><div class="div1"></div><div class="div2"></div><div class="div3"></div><div class="div4"></div><div class="div5"></div></div></body><script>window.onload = function() {//获取容器父元素var div0 = document.getElementsByClassName('div0')[0];//height 计算属性的高度var height = parseInt((window.getComputedStyle(div0, null).height).replace('px', ''));console.log(height,"div0的计算高度")window.onscroll = function() {let scrollTop = document.documentElement && document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;//+-5是为了保证一定的弹性，并非要刚好相等才出发，if(height - 5 <= scrollTop + clientHeight && scrollTop + clientHeight <= height + 5) {console.log('监听成功', '到达底部')}}}</script></html>代码的相关说明：很多时候，列表加载，我们不能够把装载子元素的父容器高度设死，此时采用style设置为auto时，element.style.height也会等于auto ，建议采用clientHeight或者利用计算样式 getComputedStyle计算高度
来源：爱蒂网
