使用jQuery获取html元素渲染高度

时间:2011-10-10 11:00:14

标签: jquery css

一个非常简单的问题。

例如,我有一个这样的类:

.someclass {
  font-size: 1.2em /* let's say that 1em is set to 10px in this example */
  padding: 1em 0 2em 0;
  border: 0.1em solid #000;
}

一些简单的html使用它:

<div class="someclass">Test</div>

我想获得此元素的生成高度 - 使用边框和填充计算高度。在这个例子中使用jQuery .height()方法给出了line-height属性的当前值 - 正如预期的那样,因为div中的文本只有一行。

我知道我可以自己做计算,因为它们相对简单,但我想问一下 - jQuery中是否有内置的解决方案?

4 个答案:

答案 0 :(得分:2)

jQuery有几种方法可以做到这一点。见http://api.jquery.com/category/dimensions/

在这种情况下,听起来像是你想outerHeight()http://api.jquery.com/outerHeight/

答案 1 :(得分:1)

转到innerHeight

此方法返回元素的高度,包括顶部和底部填充,以像素为单位。

答案 2 :(得分:1)

使用.outerHeight()

http://api.jquery.com/outerHeight/

  

获取集合中第一个元素的当前计算高度   匹配的元素,包括填充,边框,以及可选的边距。

答案 3 :(得分:1)