获取页面的可滚动高度

Get scrollable height of a page

本文关键字：滚动 高度 获取      更新时间：2023-09-26

首先，我想知道这两个术语的区别:

- $(window).height() 
- $(document).height() 
- $(window).scrollTop()

这些术语在我看来有些相似，我无法理解它们之间的明显区别。以下是我的回答:

  • $(window).height():给出用户可以看到的窗口的高度

  • $(document).height():给出文档的总高度。

  • $(document).scrollTop():给出滚动条在窗口中的垂直位置

真正的问题:我试图实现懒惰加载的东西，我需要做一个调用服务器时，滚动条已经越过点200px从页面底部。我无法使用上面的值来得到这个

任何帮助都会很感激。

窗口是您可以看到的区域-就好像您的屏幕是一个窗口，您正在查看文档。文档就是整个文档——它可以比窗口短，也可以比窗口长很多。

这是你需要的数学:

if( $(document).height() - $(document).scrollTop() < 200 ){
    //Do something
}

$(window).height();   // returns height of browser viewport
$(document).height(); // returns height of HTML document
$(window).scrollTop(); //Get the current vertical position of the scroll bar for the first               element in the set of matched elements or set the vertical position of the scroll bar for every matched element.
$(window).scrollHeight(); //Height of the scroll view of an element; it includes the element padding but not its margin.

最终，在理解了这些术语之后，我弄清楚了应该怎么计算。感谢这些答案。我的定义几乎是正确的。

function (isScrollable) {
  var isUserAtBottom = ($(window).height() + $(window).scrollTop() + 200 > $(document).height());
  if (isUserAtBottom) {
     // Do something (Like Ajax call to server to fetch new elements) 
     return true;
  }
}
相关文章：