Javascript：如何捕获网站内容的高度？

Question

我正在尝试找到正确的 JavaScript 代码来捕获网页上所有内容的高度。

我查看了 document.height、window.screen.height、document.body.offsetHeight、bodyScroll、clientArea.style.height、bodyHeight 和 document.documentElement.clientHeight。

我正在使用 FireBug 来测试这些值，但当我调整窗口大小时，所有值（window.screen.height 除外）似乎都会发生变化，因此它们并未实际报告内容的实际高度。

现在，即使我更改为不同尺寸的不同页面，window.screen.height 也永远不会改变。

如何确定内容的总高度？基本上我需要知道滚动条知道什么。滚动条知道每页滚动多少以及滚动多少才能到达内容末尾。

任何帮助将不胜感激。

Answer 1

试试这个：

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" ></script>
<script type="text/javascript">

$(document).ready(function(){

document_height = $(document).height();
document_width = $(document).width();
window_height = $(window).height();
window_width = $(window).width();

alert(document_height + ' x ' + document_width);

alert(window_height + ' x ' + window_width);
});

</script>

Answer 2

不同的浏览器以不同的方式报告窗口的大小和文档的大小。您可以使用库来解决跨浏览器问题，如 jQuery 中的代码：

$(document).height();

没有库，我使用此代码来获取尺寸：

var b, h, info;
b = document.body;
h = b.parentNode;
if (window.opera) {
  info = { winWidth: b.clientWidth, winHeight: b.clientHeight, pageWidth: h.clientWidth, pageHeight: h.clientHeight };
} else {
  info = { winWidth: h.clientWidth, winHeight: h.clientHeight, pageWidth: b.clientWidth, pageHeight: b.clientHeight };
}

Answer 3

var height = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);