计算div的高度

我有一个设定高度的div。计算div的高度

<div class="foo" style="height:100px;">bar</div>

如果我的样式属性未明确设置高度，是否可以找到div的高度？

换句话说，我想找到下面的div的高度，而实际上并没有改变div。

<div class="foo">bar</div>

来源

2015-04-22 Steven Wexler

你使用jQuery？你可以通过jQuery $（'。foo'）获得元素的高度。outerHeight（）; – jerrylow

不需要jquery。请参阅下面我使用简单的'clientHeight'属性的答案。 – boombox

var clone = $('.foo').clone(); 
clone.css('height', 'auto'); 
clone.css('visibility', 'hidden'); 

$('body').append(clone); 

console.log(clone.height());

来源

2015-04-22 18:44:51 AmmarCSE

即将写出它，最好的办法，但我认为高度的默认值是auto; –

@YannChabot，你的权利，更新我的答案。谢谢！ – AmmarCSE

很酷我会试试这个。看起来很棒！ –

-1

如果您正在使用jQuery你可以抢用$高度（”目标类的）。高度（）

来源

2015-04-22 18:44:16

这得到我的div的高度。它没有得到我的div的高度，style = height：100px被删除。 –

对不起，它似乎为我工作。 http://jsbin.com/pikutiqine/1/可能是我缺少的东西 –

你误解了我的问题。请参阅@ AmmarCSE的答案。 –

使用clientHeight属性来获取的内部高度元件。 clientHeight相当于css height属性。请参见下面的代码段（第一行展示了使用的clientHeight）：

var height = document.getElementsByClassName('foo')[0].clientHeight; 
 

 
document.getElementById('heightOfFoo').innerHTML = height;

<div class="foo">bar</div> 
 

 
<div id="heightOfFoo"></div>

来源

2015-04-22 18:50:03 boombox

你能解释一下你的答案如何得到没有style =“height：100px”的修改div的高度。 –

看看这个：https：//developer.mozilla.org/en-US/docs/Web/API/Element/clientHeight。它是CSS对象模型规范的一部分。 – boombox

我认为你误解了我的问题。请参阅@ AmmarCSE的答案。 –

计算div的高度

回答

相关问题