JS获取滚动条到底部得距离

最新推荐文章于 2024-07-20 13:48:02 发布

cv酱

最新推荐文章于 2024-07-20 13:48:02 发布

阅读量1.6k

点赞数 1

分类专栏：前端文章标签： javascript 前端 html

本文链接：https://blog.csdn.net/yinguser/article/details/125017407

版权

本文介绍如何使用JavaScript来获取网页滚动条距离底部的像素值，以便在滚动到底部时触发特定事件，如加载更多内容。

摘要由CSDN通过智能技术生成

 // 监听滚动    FirstPage   是父组件传过来的值 判断调用哪个的
addEvent() {
      window.addEventListener(
        'scroll',
        this.type == 'FirstPage' ? this.firstPageScrollEvent : this.scrollDomScrollEvent
      );
    
    },
    // 滚动出首页则展示
    firstPageScrollEvent() {
      const height = document.getElementsByTagName('html')[0].clientHeight;
      const scrollTop =
      document.getElementsByTagName('html')[0].scrollTop ||
      document.getElementsByTagName('body')[0].scrollTop; 
       let scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight
 
    // 变量 windowHeight 是可视区的高度
    let windowHeight = document.documentElement.clientHeight || document.body.clientHeight
// let scrollTop1 = document.documentElement.scrollTop || document.body.scrollTop
    // 滚动条到底部得距离 = 滚动条的总高度 - 可视区的高度 - 当前页面的滚动条纵坐标位置
    var scrollBottom = scrollHeight - windowHeight - sc