javascript - 根据 div 中的内容显示/隐藏

Question

我想根据包含或不包含内容的 div 标签显示或隐藏标题元素(例如 <h3></h3> )。内容是动态添加的，但 header 元素是静态的，这导致 header 元素多次显示在其下方没有内容。这是一个例子:

<div id=related-section>
<h3>Related Articles</h3>
<div id=related>
<p>This content is being shown, sometimes it is not shown.</p>
</div>
</div>

更多细节:<div id=related> 有两种状态看起来，它是(例如)1)<div id=related><p>Prima insolens hendrerit his et, sit exerci detracto...</p></div>或 2) <div id=related></div> .后者显示 div 中的内容为零。

Answer 1

在更新 #related

的内容后，您可以使用 jQuery 执行以下操作

if( $("#related *").length > 0 ) {
   $("#related-section h3").show();
} else {
   $("#related-section h3").hide();
}

但如果它是您提供的完整代码，您也可以隐藏/显示整个 div #related-section，因为那时它没有其他可见内容。