首页 > Web开发 > 详细

原生js实现简单的下拉加载

时间:2019-11-18 19:26:51      阅读:109      评论:0      收藏:0      [点我收藏+]
#获取当前滚动条的高度
document.documentElement.scrollTop

技术分享图片

  #获取当前窗口的高度

document.documentElement.clientHeight

技术分享图片

  #获取当前整个文档的高度

document.documentElement.scrollHeight

技术分享图片

 

添加滚动事件,当滚动条高度+窗口高度=文档高度

或者

当滚动条高度+窗口高度>=文档高度-20px时,触发加载,

创建div元素,从列表中依次拿出数据写入div元素内

 技术分享图片

 

 最终效果:

技术分享图片

 

 每次向下滚动都会加载新的元素。

 



原生js实现简单的下拉加载

原文:https://www.cnblogs.com/pfeiliu/p/11884271.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!