当前位置:Gxlcms > JavaScript > JS简单实现滑动加载数据实例分享

JS简单实现滑动加载数据实例分享

时间:2021-07-01 10:21:17 帮助过:2人阅读

本文主要介绍了JS简单实现滑动加载数据的方法,涉及javascript事件响应及页面元素属性动态操作相关技巧,需要的朋友可以参考下,希望能帮助到大家。

//滑动
function getScrollTop()
{
 var scrollTop = 0;
 if (document.documentElement && document.documentElement.scrollTop) {
   scrollTop = document.documentElement.scrollTop;
  }else if (document.body) {
  scrollTop = document.body.scrollTop;
  }
  return scrollTop;
}
//获取当前可视范围的高度
function getClientHeight()
{
 var clientHeight = 0;
 if (document.body.clientHeight && document.documentElement.clientHeight) {
   clientHeight = Math.min(document.body.clientHeight, document.documentElement.clientHeight);
 }else {
   clientHeight = Math.max(document.body.clientHeight, document.documentElement.clientHeight);
 }
   return clientHeight;
}
//获取文档完整的高度
function getScrollHeight()
{
   return Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
}
//绑定事件
window.onscroll = function ()
{
 if (getScrollTop() + getClientHeight() == getScrollHeight()) {
  //dosomething
 }
}

相关推荐:
javascript - js如何在滑动加载的时候限定滑动的加载次数

Javascript vue.js表格分页,ajax异步加载数据

Bootstrap treeview实现动态加载数据及快捷搜索功能的实现

以上就是JS简单实现滑动加载数据实例分享的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行