如何使用JavaScript获取整个文档的高度？
一些文件我无法得到文件的高度（绝对定位在最底层）。 此外，填充底部在这些页面上似乎什么都不做，但在高度将返回的页面上。 案例点：
http://fandango.com
http://paperbackswap.com
在Fandango
jQuery的$(document).height(); 返回正确的值
document.height返回0
document.body.scrollHeight返回0
在平装置换：
jQuery的$(document).height(); TypeError： $(document)为null
document.height返回一个不正确的值
document.body.scrollHeight返回一个不正确的值
注意：如果在那里有一些技巧，我有浏览器级别的权限。
文档大小是浏览器兼容性的噩梦，因为虽然所有的浏览器都暴露了clientHeight和scrollHeight属性，但是他们并不都同意如何计算这些值。
过去有一个复杂的最佳做法公式围绕你如何测试正确的高度/宽度。 这包括使用document.documentElement属性（如果可用）或回退到文档属性等。
获得正确高度的最简单方法是获取在文档或documentElement上找到的所有高度值，并使用最高值。 这基本上是jQuery所做的：
var body = document.body, html = document.documentElement; var height = Math.max( body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight );
使用Firebug + jQuery书签的快速测试会返回两个引用页面的正确高度，代码示例也是如此。
请注意，在文档准备好之前测试文档的高度总是会导致0.另外，如果您加载了更多内容，或者用户调整了窗口大小，则可能需要重新测试。 如果您在加载时需要使用onload或文档就绪事件，否则只需测试您需要的数字即可。
这是一个非常古老的问题，因此有许多过时的答案。 截至2017年，所有的浏览器都遵守这一标准。
2017年的答案：
document.body.scrollHeight
你甚至可以使用这个：
var B = document.body, H = document.documentElement, height if (typeof document.height !== 'undefined') { height = document.height // For webkit browsers } else { height = Math.max( B.scrollHeight, B.offsetHeight,H.clientHeight, H.scrollHeight, H.offsetHeight ); }
或更多的jQuery的方式（因为你说的jQuery不说谎）:)
Math.max($(document).height(), $(window).height())
确定文档大小的“jQuery方法” – 查询所有内容，获得最高的价值，希望在大多数情况下获得最好的作品，但不是全部 。
如果你真的需要文档大小的防弹结果，我建议你使用我的jQuery.documentSize插件。 与其他方法不同，它实际上测试并评估浏览器在加载时的行为，并根据结果从那里查询正确的属性。
这个一次性测试对性能的影响是很小的 ，即使是在最奇怪的情况下，插件也能返回正确的结果 – 不是因为我这么说，而是因为一个大规模的自动生成的测试套件实际上验证了它的确。
因为这个插件是用vanilla Javascript编写的，所以你可以在没有jQuery的情况下使用它。
为了更一般地找到任何文档的高度，你可以通过简单的递归找到当前页面上最高的DOM节点：
;(function() { var pageHeight = 0; function findHighestNode(nodesList) { for (var i = nodesList.length - 1; i >= 0; i--) { if (nodesList[i].scrollHeight && nodesList[i].clientHeight) { var elHeight = Math.max(nodesList[i].scrollHeight, nodesList[i].clientHeight); pageHeight = Math.max(elHeight, pageHeight); } if (nodesList[i].childNodes.length) findHighestNode(nodesList[i].childNodes); } } findHighestNode(document.documentElement.childNodes); // The entire page height is found console.log('Page height is', pageHeight); })();
您可以在示例站点（ http://fandango.com/或http://paperbackswap.com/ ）上测试它，并将此脚本粘贴到DevTools控制台。
注意：它正在使用Iframes 。
请享用！
我撒谎，jQuery返回两个页面$（document）.height（）; …为什么我怀疑它的正确值？
计算高度+滚动使用吹码
var dif = document.documentElement.scrollHeight - document.documentElement.clientHeight; var height = dif + document.documentElement.scrollHeight +"px";
正确添加引用
在我的情况下，我正在使用ASCX页面，包含ascx控件的aspx页面没有正确使用引用。 我只是粘贴下面的代码，它的工作：
<script src="../js/jquery-1.3.2-vsdoc.js" type="text/javascript"></script> <script src="../js/jquery-1.3.2.js" type="text/javascript"></script> <script src="../js/jquery-1.5.1.js" type="text/javascript"></script>
以跨浏览器/设备的方式获取宽度使用：
function getActualWidth() { var actualWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth || document.body.offsetWidh; return actualWidth; }
我现在不知道如何确定高度，但是你可以用它来放置一些东西：
<html> <head> <title>CSS bottom test</title> <style> .bottom { position: absolute; bottom: 1em; left: 1em; } </style> </head> <body> <p>regular body stuff.</p> <div class='bottom'>on the bottom</div> </body> </html>
下面的这个跨浏览器代码评估body和html元素的所有可能的高度，并返回找到的最大值：
var body = document.body; var html = document.documentElement; var bodyH = Math.max(body.scrollHeight, body.offsetHeight, body.getBoundingClientRect().height, html.clientHeight, html.scrollHeight, html.offsetHeight); // The max height of the body
一个工作的例子：
function getHeight() { var body = document.body; var html = document.documentElement; var bodyH = Math.max(body.scrollHeight, body.offsetHeight, body.getBoundingClientRect().height, html.clientHeight, html.scrollHeight, html.offsetHeight); return bodyH; } document.getElementById('height').innerText = getHeight();
body,html { height: 3000px; } #posbtm { bottom: 0; position: fixed; background-color: Yellow; }
<div id="posbtm">The max Height of this document is: <span id="height"></span> px</div> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br />
