js页面滚动到底部,div滚动事件

　　问题：在H5，我们有这样一个要求：例如，当有一个列表时，当滚动到底部时，我们需要加载更多。

　　解决方案：可以使用窗口的滚动事件进行处理。

　　分析：如果滚动是针对整个屏幕(而不是针对一小块界面)，那么这个应该成立：屏幕的高度，最大滚动距离=内容的高度。

　　代码实现：

　　Html元字符集= UTF-8 标题监视器滚动到底部滚动到底部/标题样式. div 2 { width:100px；高度：100pxborder:1px纯红} * { margin:0 } . button 1:active { background:red } body { height:375 px；宽度：667px边框：1px纯红} .div1 {高度：600px宽度：100%；背景：红色} .div2 {高度：600px宽度：100%；背景：绿色} .div3 {高度：600px宽度：100%；背景：蓝色} .div4 {高度：600px宽度：100%；background:yellow }/style/head body Div class= Div 0 Div class= Div 1 /Div Div class= Div 2 /Div Div Div class= Div 3 /Div Div class= Div 4 /Div/body script window . onload=function(){//获取容器父元素vardiv 0=document . getelementsbyclassname( Div 0))[0]；//height计算属性var height=parseint的高度((window.getComputedStyle (div0，null))。身高)。replace (px ， )；Console.log (height， div0的计算高度)window . on scroll=function(){/* scroll top是滚动条顶部到界面右上角的距离，用兼容的方式写*/let scroll top=document . documentelementdocument . documentelement . scroll top？document . document element . scroll top:document . body . scroll top；//-5是为了保证一定的灵活性，而不仅仅等于start，if(height-5=scroll top client height scroll top client height=height 5){ console . log(成功监测，到达底部)}}} /script/html代码：很多时候，加载列表的时候，我们无法设置死加载子元素的父容器的高度。此时，当样式设置为auto时，element.style.height也将等于auto。建议使用clientHeight或getComputedStyle计算高度。

　　摘要

　　以上就是边肖给大家介绍的解决HTML5底部滚动问题的方法。希望对你有帮助。如果您有任何问题，请给我留言，边肖将及时回复您。非常感谢您对网站的支持！

　　如果你觉得这篇文章对你有帮助，请转载，请注明出处，谢谢！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。