我想检测下面定义的 html 元素的高度。为此，我正在使用 Jquery(下面的示例)。我希望变量 x 超过 40 像素，但它始终设置为 10。我发现如果我将元素上的填充从 5 像素更改为 6。值 x 设置为 12。这仅表示填充正在返回。这不是我想看到的行为，我尝试了通过 jquery 执行此操作的其他变体，但结果更加困惑。
谁能找出出现这种情况的原因。谢谢:)
<section id=\"sophiaHeader\">Show Me Products I\'ll Like<p id=\"disclaimer\" style=\"top:' + disclaimerYPosition +'; right:'+ disclaimerXPosition +' ;\"><img id="sophiaLogo" src="https://d33f10u0pfpplc.cloudfront.net/perun/v1/images/bookmarklet/favicon.ico"></p> </section>
绑定(bind)到该元素的 css 是:
#sophiaHeader {
font-family: Arial, Helvetica, sans-serif;
background-color: #4c3290;
border: 0 none;
margin: 0;
cursor: pointer;
color: white;
font-size: 15px;
padding: 5px;
text-align: center;
text-transform: uppercase;
}
查询
var x = jQuery('#sophiaHeader').outerHeight();
注意:代码像这样附加到容器中。是上面的代码 = sophiaCustomHeaderHTML
jQuery("#widget-container").append(sophiaCustomHeaderHTML)
最佳答案
问题是它被附加到的容器被设置为
display:none
因此高度返回为零。
希望这对其他人有帮助:)
关于jquery - 检测元素高度时的错误行为，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24287201/