jQuery 高度总是返回 0

Question

我陷入了元素的简单 jQuery 高度。我想获取元素的实际高度。但我总是得到 0。

我尝试了以下代码。

jQuery('.inclusions2').height(); 
jQuery('#inclusions2').outerHeight();
jQuery('#inclusions2').prop('scrollHeight');
jQuery('#inclusions2').innerHeight();

所有代码始终返回 0。

这是我正在检查的实时代码 URL。 Link

编辑 1

这是代码示例。

<div class="tab" id="inclusions2">
    <div class="col-md-12">
        <div class="tab_contents">
            <div class="section-title text-center">
                <div class="title-border">
                    <h1><span>Inclusions</span></h1>
                </div>
            </div>
            <p class="tab_para"><strong>The above prices are based on below Inclusions with</strong> ONE FOC in a Single room.</p>
        </div>
    </div>
</div>

当我在测试页面上检查它时，代码有效并返回实际高度，但在网站上它总是返回 0。

Answer 1

您的 #inclusions2 元素只包含一个 float 元素/子元素 (col-md-12) 因为 float 内容不计算/不计算高度默认情况下，高度为零(在该元素上使用浏览器工具时也可以看到)。

但是，如果您将 overflow: visible; 添加到 #inclusions2 的 CSS 规则中，此行为会发生变化并且您的 jQuery 代码(使用 outerHeight()) 将按预期工作。