11

Firebug 告诉我计算的样式my_div

宽度 300 像素

高度 453.167px

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

4

2 回答 2

21

根据选择的浏览器,其中之一将执行以下操作:

mydiv.offsetHeight
mydiv.clientHeight

获取剪辑的 DIV 的全高

获取div的高度

于 2012-05-25T01:00:10.000 回答
-3

更新:

自从我最初的回答以来,许多浏览器不一致的问题已经得到修复。现在clientHeightDOM 元素的属性是可靠的。

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();

使用库通常是做某事最简单和最跨浏览器的方式。使用 vanilla js 获取计算样式是不可靠的,因为不同浏览器的属性不同。

于 2012-05-25T01:03:29.740 回答