在Javascript中计算元素高度答案

【问题标题】：Counting element height in Javascript在Javascript中计算元素高度
【发布时间】：2012-07-19 10:09:36
【问题描述】：

我有这样的 Javascript 代码：

$content.each(function(i) {
    var $el = $(this);
    // save each content's height (where the menu items are)
    // and hide them by setting the height to 0px
    $el.data('height', $el.outerHeight(true)).css('height', '0px').show();
});

在这种情况下：

 <div id="sbi_container" class="sbi_container">
        <div class="sbi_panel" data-bg="images/1.jpg">
            <a href="#" class="sbi_label">About</a>
            <div class="sbi_content">
                <ul>
                    <li><a href="#">Subitem</a></li>
                    <li><a href="#">Subitem</a></li>
                    <li><a href="#">Subitem</a></li>
                </ul>
            </div>
        </div>
        <div class="sbi_panel" data-bg="images/2.jpg">
            ...
        </div>

我不知道为什么，但是当只有<ul>（我们正在计算的高度）有一个包含多个单词的<li> 时，它会在<ul> 下方添加一个单独的空格。当只有一个长字时，一切都好。

有什么想法吗？ :)

【问题讨论】：

您需要增加width 的ul 元素
@Blaster 如果没有设置明确的宽度，这不应该自己增加吗？
@JonTaylor：我们不知道它是否没有明确的宽度设置，即使没有，它的宽度将取决于它的容器
@Blaster 我同意，但是，一个长词有不同的行为这一事实很奇怪。虽然可能是由于自动换行。如果 OP 可以提供更多细节，那就太好了。
我用这个作为基础tympanus.net/Development/SlidingBackgroundImageMenu/…。我说的是子菜单高度。我不太了解Javascript，所以我能做的就是发布整个代码。因为我不知道你需要做什么来帮助我。说我是否需要这样做。：）谢谢！ :)

标签： javascript jquery dom

【解决方案1】：

试试这个

.your_ul { font-size: 0; }
.your_ul li { font-size: 1234px }

它可能会起作用。

【讨论】：