如何在jQuery中计算div的高度?

时间:2012-12-31 05:54:08

标签: javascript jquery

我处于这种情况,我必须设置div的高度取决于其中的内容量,我不能给它min-height。我知道我们可以通过以下方式计算div的高度:

$("#divid").height();

那么有没有什么方法我们可以计算div的高度而没有高度参数,并给该div的高度取决于其中的内容量。

我希望我能清楚地解释清楚。

由于

4 个答案:

答案 0 :(得分:6)

你的措辞有点令人困惑,但我认为你问的是如何计算div中内容的大小,即使div应用了不同的高度。为此,您可以使用元素scrollHeight

$('#divid')[0].scrollHeight

如果您只是想知道如何计算元素的高度,即使它没有高度的属性/样式,您也可以使用您在问题中写的内容。 .height()直接从浏览器呈现的值计算元素的高度,而不是从具体的属性计算。

答案 1 :(得分:2)

你有两种方法:

$("#parent").height($("#child").outerHeight(true));
//-----------------------------^^^^^^^^^^^--^^^^-----outerHeight(true) will give
//---------------------------------------------------you the total height 
//---------------------------------------------------including top bottom margins

更多信息.outerHeight: http://api.jquery.com/outerHeight/

如果你的html是:

<div style="height:450px;"></div>

然后你可以用它来获得高度:

$("#parent").css('height'); // this will give you the 450px

答案 2 :(得分:1)

就像你说的那样,使用.height(),不需要为要使用的实际高度定义。这是一个jsfiddle显示它的实际效果:http://jsfiddle.net/nWb5j/

答案 3 :(得分:0)

jQuery calculates the height, using .height(),即使元素上没有高度设置(通过CSS或其他方式)。