window . onscroll = function ( ) { //变量scrollTop是滚动条滚动时,距离顶部的距离 var scrollTop = document . documentElement . scrollTop || document . body . scrollTop ; //变量windowHeight是可视区的高度 var windowHeight = document . documentElement . clientHeight || document . body . clientHeight ; //变量scrollHeight是滚动条的总高度 var scrollHeight = document . documentElement . scrollHeight || document . body . scrollHeight ; //滚动条到底部的条件 if ( scrollTop + windowHeight == scrollHeight ) { console . log ( "距顶部" + scrollTop + "可视区高度" + windowHeight + "滚动条总高度" + scrollHeight ) ; alert ( '已经滚到底部了了!' ) ; clear ( ) ; < / script > javascript 网页自动滚动到底部函数&lt;!-- 页面自动滚动到底部 --&gt;&lt;script language="javascript"&gt;//页面加载完毕后执行window.onload=function(){//设置定时器 timer=setInterval("scrollwindow()",1000);}//清除定时器function clear(){ clearInterval(timer);}//滚动函数let gao=0;func 代码如下: [removed] = function(){   var h = document.documentElement.scrollHeight || document.body.scrollHeight;   window.scrollTo(h,h); 以上2种方法均可以实现页面加 现在我们来了解几个dom属性: scrollTop:获取或设置一个元素的内容垂直 滚动 的像素数,当一个元素的内容没有产生垂直方向的 滚动 条,那么它的 scrollTop 值为0 scrollHeight:这是一个只读属性,是元素内容高度的度量,...
这个实例应该说可以很简单,直接使用jQuery的方法来处理也是可以的。但本文底层使用原生的js来处理,遇到一些小知识点可以分析一下也算有所得。 原理很简单,就是为window添加一个scroll事件,浏览器每次触发scroll事件时判断是否 滚动 到了浏览器 底部 ,如果到了 底部 则加载新数据。关键是计算 滚动 条是否 滚动 到了浏览器 底部 ,算法如下 滚动 条卷起来的高度 + 窗口高度 > 文档的总高度 + 50/*我这里将 滚动 响应区域高度取50px*/;如果这个判断为true则表示 滚动 滚动 到了 底部 。 <style type="text/css"> html,body, div, dl, dt, d
``` javascript var form = document.getElementById('form'); //获取表单元素 var formHeight = form.scrollHeight; //获取表单的高度 var scrollSpeed = 1; //设置 滚动 速度,可以根据需求修改 function autoScroll() { if (form.scrollTop < formHeight) { //当前 滚动 位置小于表单高度时 form.scrollTop += scrollSpeed; //向下 滚动 setTimeout(autoScroll, 50); //调用自身,实现 自动 滚动 } else { form.scrollTop = 0; // 滚动 底部 时,回到顶部 setTimeout(autoScroll, 50); //调用自身,实现循环 滚动 autoScroll(); //调用 函数 ,开始 自动 滚动 这段代码会获取到表单元素,并获取表单的高度。然后设置一个 滚动 速度,通过循环调用自身的方式实现表单的 自动 滚动 。 希望对您有所帮助!