Javascript 如何使用JS/jQuery获取元素的高度？

更新#1:这是和我所有的代码

我有一个这样的结构：

<ul class="topStoriesTab">
    <li data-id="month" class="top_articles">
        <article class="text-center">
            <a href="#post_url" class="topStoriesTitle">Post Title</a>
            <br>
            <a href="#url_here" class="topStoriesAuthor">Author name</a>
            <br>
            <span class="middot text-center topStoriesMidDot">·</span>
        </article>
        ...
    </li>
    <li data-id="year" class="top_articles">
        <article class="text-center">
            <a href="#post_url" class="topStoriesTitle">Post Title</a>
            <br>
            <a href="#url_here" class="topStoriesAuthor">Author name</a>
            <br>
            <span class="middot text-center topStoriesMidDot">·</span>
        </article>
        ...
    </li>
</ul>

最后，我在find中使用以下选择器尝试了上述所有方法，但仍然没有成功：

// $tabContent corresponds to the active li element inside the ul.topStoriesTab
$tabContent.find('article *').each(
    function(i)
    {
        // Return 0
        console.log($(this).height());

        // Return 0
        console.log($(this)[0].clientHeight)

        // Return 0
        console.log($(this)[0].offsetHeight)
    }
);

那么，有没有办法得到这些元素的高度

更新#1:这是和我所有的代码

---

正如您所看到的，列表下面的“Heading”元素位于li内部，因为UL元素似乎没有高度。这就是我试图解决的问题。

这可以通过

css

和属性来实现

#wpf_top_articles-2{溢出：隐藏；}

---

如果使用jquery，则可以使用

$（'selector'）.outerHeight（）

或

$（'selector'）.innerHeight（）

。

问题已解决。解决办法如下：

// $tabContent corresponds to the active li element inside the ul.topStoriesTab
$tabContent.find('article').each(
    function(i)
    {
        // Return 0
        console.log($(this).height());

        // Return 0, while in console the samve value is 64
        console.log($(this)[0].clientHeight)

        // Return 0, while in console the samve value is 64
        console.log($(this)[0].offsetHeight)
    }
);

而不是我的jQuery插件中的此代码：

function __updatePluginHeight($this, $tabContent)
{
    $total_height   =   0;

    $tabContent.find('article').each(
        function(i)
        {
            console.log($(this)[0].offsetHeight);
        }
    );
}

我已将代码修改为：

function __updatePluginHeight($this, $tabContent)
{
    console.log($tabContent.height());
}  

---

非常感谢您的帮助：）

您能创建一把小提琴吗？好的，我现在就创建：）那么，您想要每篇

文章的高度吗？

？谢谢您的回答，但我不想隐藏过度折叠的元素。相反，我喜欢设置.topStoriesTab的高度，以显示所有元素，标题应位于下方。目前.topStoriesTab的高度似乎设置为0，这是我想要克服的。哦，这是什么？我在关于解决方案的问题中给出了答案。非常感谢曼塔：）这不是一个例外的问题。若你们读了这个问题，你们会发现我在搜索一个特定元素的高度。无论如何，感谢您的帮助。请将

选择器

替换为所需高度元素的id。