网页无限下拉功能是靠什么实现的? 类似于百度图片的那种，下拉自动刷新下页内容！

Question

如题，请大神帮我解答

Answer 1

那它的原理是什么了？
1.首先预先加载一部分内容，并显示出滚动条。
2.监听浏览器滚动条。
3.当滚动条快到浏览器底部的时候，触发请求。
4.加载新的页面
代码如下
<script>

var bodyObj=document.documentElement||document.body;
scrollTop=bodyObj.scrollTop,
browseHeight=bodyObj.clientHeight||window.innerHeight;

window.onscroll=function(){
debugger;
var currentScrollTop=bodyObj.scrollTop,
pageHeight=bodyObj.scrollHeight;
document.title=currentScrollTop+"|"+browseHeight;
if(pageHeight-(browseHeight+currentScrollTop)<100){
document.title="到底部了！";
}else{
document.title="还没有到了！";
}
}
</script>
如果判断滚动条到达页面的底部了？
首先要获得页面总高度和当前滚动条上底部的高度。
因为scrollTop+browseHeight=pageHeight，所以当它们到相差很小的时候，说明就已经到页面的底部了。