如何获取body元素的高度

本文介绍了如何获取body元素的高度的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

这里，所有< div> 的总高度为900像素，但jQuery函数将主体的高度返回为577像素。（如果我删除正文CSS，它的工作）。

Here the total height of all <div>'s are 900 pixels, but the jQuery function returns the height of the body as 577 pixels. (If I remove the body CSS, it's working).

这个问题有解决方案吗？

Is there a solution for this problem?

$j(function() {
    alert($j("body").height());
})

html, body {
    height:100%;
}

<div style="height:200px">header</div>
<div style="height:500px">content</div>
<div style="height:200px">footer</div>

推荐答案

设置

html { height: 100%; }
body { min-height: 100%; }

而不是 height：100％。

jQuery返回的结果是正确的，因为您已将body的高度设置为100％，这可能是视口的高度。这三个DIV导致溢出，因为BODY元素中没有足够的空间。要查看我的意思，请为BODY标签设置边框，然后检查边框的结束位置。

The result jQuery returns is correct, because you've set the height of the body to 100%, and that's probably the height of the viewport. These three DIVs were causing an overflow, because there weren't enough space for them in the BODY element. To see what I mean, set a border to the BODY tag and check where the border ends.

这篇关于如何获取body元素的高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！