如果div标签中的span元素使用jquery为空，则隐藏元素

Question

如果div中的span元素没有文本

，我想隐藏一个元素

下面是示例HTML

<div class="showcase-caption" style="display: block;">
 <span> If this span has no text then i need to change the display property of outer div to none</span>
</div>

JsFiddle link

我尝试使用css执行此操作，但它没有按预期工作。所以我认为jquery可以更好地工作并处理旧的浏览器。

在这种情况下，我需要更改由其他脚本自动生成的内联属性，以显示图库的图像标题。

更新： 谢谢你们的回复。我选择'satpal'解决方案因为它很短而且给了我确切的结果。

Answer 1

只需使用 :empty 即可。你不需要if block。

$('.showcase-caption span:empty').parent().hide()

Demo

Answer 2

尝试使用.is()和:empty选择器来完成您的任务，

if($('.showcase-caption span').is(':empty')) { 

DEMO

完整代码：

var cache = $('.showcase-caption');
if($('span', cache).is(':empty')) {
  cache.hide();
} 

DEMO

---

或者您可以使用:has()选择器

进行简单编写

$('.showcase-caption:has(span:empty)').hide();

DEMO

Answer 3

Updated Demo

使用jQuery is()和 :empty 伪选择器。

if( $('.showcase-caption span').is(':empty') ) {
    $('.showcase-caption').hide();
} 

Answer 4

if($(".showcase-caption span").html().trim().length <= 0 ){
            $(".showcase-caption").hide();
}

Answer 5

试试这个。

$(function){
    if($('.showcase-caption span').is(':empty')){
        $('.showcase-caption').css("display" , "none");
    }

    }