获得div高度

Question

Firebug告诉我计算出的my_div样式：

宽度300px

身高453.167px

然而，当我执行console.log(mydiv.style.height)时，它会给我一个空字符串，即使console.log(mydiv)记录了正确的元素。我确信在调用此日志记录代码时页面已加载。我很欣赏不使用jQuery的解决方案。

Answer 1

根据所选的浏览器，其中之一可以：

mydiv.offsetHeight
mydiv.clientHeight

Get full height of a clipped DIV

Getting the height of a div

Answer 2

更新：

自我的原始答案以来，许多浏览器的不一致性已得到修复。现在，DOM元素的clientHeight属性是可靠的。

var height = element.clientHeight;

  

对于没有CSS或内联布局框的元素，Element.clientHeight只读属性为零，否则它是元素的内部高度（以像素为单位），包括填充，但不包括水平滚动条高度，边框或边距。

     

clientHeight可以计算为CSS高度+ CSS填充 - 水平滚动条的高度（如果存在）。

     

注意：此属性将值舍入为整数。如果需要小数值，请使用element.getBoundingClientRect（）。

来源：https://developer.mozilla.org/en-US/docs/Web/API/Element/clientHeight

原始答案：

如果你使用jQuery JS库，你可以这样做：

var computed_height = $('#my_div').height();

如果使用Prototype JS库，则类似：

var computed_height = $('my_div').getHeight();

使用库通常是最容易的＆amp;大多数跨浏览器的方式做某事。使用vanilla js获取计算样式是不可靠的，因为不同浏览器的属性是不同的。