CSS中唯一具有文本同级的孩子

Question

我想使以下内部跨度消失，如果它是独生子：

<div class="foo">
  <span></span>  
</div>

即选择器在这种情况下不起作用：

<div class="foo">
  <span></span>  
  Some text
</div>

我试着:only-child和:last-child它不工作，我认为是因为“一些文本”的文本。

Answer 1

我认为仅靠 CSS 是无法做到这一点的。您应该通过设定一些条件来使用 jQuery 或 JavaScript。

if ($(".foo").text().length < 1 && $('.foo span').is(':empty')) {
    //hide your element here
    $('.foo').hide();
}