判断滚动条是否到达页面的尾部?

本文提供了用于检测浏览器滚动位置的JavaScript函数,包括获取滚动条位置、窗口可视区域高度及文档实际高度的方法,并通过这些信息判断是否已滚动到页面底部。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

  1.  取窗口滚动条高度   
  2. function getScrollTop()   
  3. {   
  4.     var scrollTop=0;   
  5.     if(document.documentElement&&document.documentElement.scrollTop)   
  6.     {   
  7.         scrollTop=document.documentElement.scrollTop;   
  8.     }   
  9.     else if(document.body)   
  10.     {   
  11.         scrollTop=document.body.scrollTop;   
  12.     }   
  13.     return scrollTop;   
  14. }   
  15.   
  16.   
  17.  取窗口可视范围的高度   
  18. function getClientHeight()   
  19. {   
  20.     var clientHeight=0;   
  21.     if(document.body.clientHeight&&document.documentElement.clientHeight)   
  22.     {   
  23.         var clientHeight = (document.body.clientHeight<document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;           
  24.     }   
  25.     else  
  26.     {   
  27.         var clientHeight = (document.body.clientHeight>document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;       
  28.     }   
  29.     return clientHeight;   
  30. }   
  31.   
  32.  
  33.  取文档内容实际高度   
  34. function getScrollHeight()   
  35. {   
  36.     return Math.max(document.body.scrollHeight,document.documentElement.scrollHeight);   
  37. }   
  38.         function test(){   
  39.     if (getScrollTop()+getClientHeight()==getScrollHeight()){   
  40.         alert("到达底部");   
  41.     }else{   
  42.         alert("没有到达底部");   
  43.     }   
  44.         }  
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值