Question

我有div高度固定（例如：500px）。这个div里面包含一些html块元素。我想要实现的是使用javascript检测我的div有多高，如果我将高度自动设置为固定高度。

<div id="someId" style="height: 500px;">
    <p>My paragraf</p>
    <h1>My heading</h1>
</div>

按照其他单词的顺序，我想得到div的高度，而不考虑底部的空白区域。

我有什么方法可以做到这一点吗？

Answer 1

你如何计算孩子的身高并加起来？类似的东西：

<div id="#someId" style="height: 500px;">
    <p>My paragraf</p>
    <h1>My heading</h1>
</div>

所以在jQuery中

var height = $('#someId > p').height()+$('#someId > h1').height();

修改或者如果你想要一些通用的东西：

var height = 0; $( "#someId" ).children().each(function() { height = height + $(this).height(); });

Answer 2

我想我找到了一个解决方案：

$('#someId').clone().attr('id', 'cloneId').appendTo('body');
$('#someId').css({'height':'auto','opacity':'0'});
alert($('#someId').height()+'px');

首先我复制我的div，然后我将克隆div高度设置为auto，然后我得到它的高度。

Answer 3

检查此Fiddle

$(document).ready(function (){
    var previousHgt=$("div").height();
    var getheightWhenAuto=($("div").css("height","auto").height());
    $("div").css("height",previousHgt   )
    alert(getheightWhenAuto);
 });

使用javascript检测自动高度

3 个答案: