为什么 $(document).height() 与 $(document.body).height() 不同？答案

【问题标题】：why is $(document).height() different from $(document.body).height()?为什么 $(document).height() 与 $(document.body).height() 不同？
【发布时间】：2012-10-08 22:42:07
【问题描述】：

我已经在谷歌上搜索了一段时间，但仍然找不到原因
$(document).height() 与 $(document.body).height() 不同吗？

还有，谁能告诉我height方法之间的对应关系
在 jQuery 和原始的 JavaScript 中？

例如，$(document).height() 等价于 document.documentElement.scrollHeight。

【问题讨论】：

尝试正文{margin: 0; padding: 0;} 然后检查高度

标签： jquery document

【解决方案1】：

因为 HTML 中的 <body> 元素只是另一个块元素（很像 <div>），并且与任何块元素一样，它可以具有尺寸样式（margin、padding、width、 height等）。

考虑到这一点，<body> 元素的“大小”不需要直接对应于 document 对象的大小（它对应于呈现的整个 HTML 文档）。一个很好的理由是<body> 元素也在<html> 元素内部，它也是一个块元素，可以有自己的维度。

例如，如果您的<html> 元素有padding:10px，那么您的<body> 元素的有效大小肯定会与整个document 完全不同。

现在，不要误会我的意思：document 和 document.body 可以具有完全相同的大小（例如，尝试检查 StackOverflow 的），但您必须了解 <body> 是只是另一个可以通过 CSS 操作的 HTML 块。

【讨论】：

嗨，Ilagan，根据您的回答，您认为如果我们重置浏览器标准 css(html, body{margin: 0; padding: 0;})，那么我们将获得相同的高度，包括 clientHeight ，偏移高度和滚动高度？ BTW：我做了一些测试，结果不是这样。
如果您重置回html, body { margin:0; padding:0; }，并且请确保您的widths 和heights 设置正确。这不仅仅是关于边距和填充。确保您没有覆盖其他样式表中的某个地方的重置规则。

【解决方案2】：

我认为正文有一个标准边距。对于第二部分，我不知道你的意思。

【讨论】：

是的，我确实认为标准边距是导致两者不同的原因之一，但应该还有其他一些原因。无论如何，谢谢你的帮助。