$(document).height()和$(window).height()之间有什么区别

(希望它不是重复的,因为我在搜索和谷歌搜索时没有找到它)

当滚动条到达后一个div的底部时,我试图找到如何在一些固定高度div(’#div’)中检测。 我应该使用$(document).height()$(window).height()来检测此事件吗?

编辑:我的div是固定高度,我设置自动滚动,所以如何处理? 如果我想使用$(’#div’)。height(),这个高度是固定的….

.height()文档中:

 $(window).height(); // returns height of browser viewport $(document).height(); // returns height of HTML document 

在您的情况下,听起来您可能想要document的高度而不是window 。 可以这样想: window高度就是您所看到的,但document高度包括下方或上方的所有内容。

编辑

scrollTop()方法的帮助下检查滚动的顶部和底部:

 var bottom = $(document).height() - $(window).height(); $(document).scroll(function(){ var position = $(this).scrollTop(); if (position === bottom) { console.log("bottom"); }else if(position === 0){ console.log("top"); } else { console.log("scrolling"); } }); 

文档高度是整个文档的整个高度,甚至是可视区域之外的高度。 如果您有一个长页面,这可能是数千像素。 窗户高度只是可视区域。

$(window).height()和$(document).height()函数之间的区别。

$(window).height()函数:

理想情况下,$(window).height()返回像素较少的浏览器窗口高度。 这始终是当前浏览器窗口的高度。 如果您调整浏览器大小,则此值应更改。

$(document).height()函数:$(document).height()返回正在呈现的文档高度的无单位像素值。

在HTML中,如果你没有声明DOCTYPE,那么所有时间HTML页面都返回$(window).height()和$(document).height()相同的值。

       
$(window).height() =
$(document).height() =

Lorem ipsum dolor sit amet

输出:

 $(window).height() = 750 $(document).height() = 750 Lorem ipsum dolor sit amet 

声明DOCTYPE后,它返回完美值。

   write above code here  

输出:

 $(window).height() = 750 $(document).height() = 750 Lorem ipsum dolor sit amet 

文档的高度不一定与窗口的高度相同。 如果你有一个只带有DIV和一点文字的简单文档,那么doc高度与窗口高度相比微不足道。

这是来自jQuery源代码:

 if (jQuery.isWindow(elem)) { // As of 5/8/2012 this will yield incorrect results for Mobile Safari, but there // isn't a whole lot we can do. See pull request at this URL for discussion: // https://github.com/jquery/jquery/pull/764 return elem.document.documentElement["client" + name]; } // Get document width or height if (elem.nodeType === 9) { doc = elem.documentElement; // Either scroll[Width/Height] or offset[Width/Height] or client[Width/Height], whichever is greatest // unfortunately, this causes bug #3838 in IE6/8 only, but there is currently no good, small way to fix it. return Math.max( elem.body["scroll" + name], doc["scroll" + name], elem.body["offset" + name], doc["offset" + name], doc["client" + name]); } 

因此,对于$(window) ,使用clientHeight 。 其中,正如@Drew正确提到可见屏幕区域的高度。

对于$(document) ,将使用当前页面的整个滚动高度。