在没有 CSS 高度规则的情况下确定元素的高度
在元素没有 CSS 高度规则的情况下,获取元素的高度可能会很困难它的高度。 jQuery .height() 方法需要预定义的 CSS 高度值,在这种情况下似乎不够。但是,还有其他方法可以确定元素的高度。
jQuery .height()
与普遍看法相反,jQuery .height() 不依赖关于 CSS 高度定义。它计算元素的计算高度,使其适合没有明确指定 CSS 高度的场景。
DEMO
.height():检索元素的高度没有 padding、border 或 margin。
.innerHeight():检索元素的高度,包括 padding,但不包括 border 和 margin。
.outerHeight():检索元素的高度,包括 border 但不包括margin.
.outerHeight(true):检索元素的高度,包括边框和边距。
现场演示的代码片段
<code class="js">$(function() { var $heightTest = $('#heightTest'); $heightTest.html('Div style set as "height: 180px; padding: 10px; margin: 10px; border: 2px solid blue;"') .append('<p>Height (.height() returns) : ' + $heightTest.height() + ' [Just Height]</p>') .append('<p>Inner Height (.innerHeight() returns): ' + $heightTest.innerHeight() + ' [Height + Padding (without border)]</p>') .append('<p>Outer Height (.outerHeight() returns): ' + $heightTest.outerHeight() + ' [Height + Padding + Border]</p>') .append('<p>Outer Height (.outerHeight(true) returns): ' + $heightTest.outerHeight(true) + ' [Height + Padding + Border + Margin]</p>') });</code>
以上是如何在没有显式 CSS 高度规则的情况下确定 jQuery 中的元素高度?的详细内容。更多信息请关注PHP中文网其他相关文章!