如果孩子没有文本,jQuery隐藏父母

Question

我有这个标记:

<li class="GRID_ITEM" id="123">
    <img class="imgUrl" src="search_logo_big.png">
    <div class="title"></div>
</li>

li.GRID_ITEM如果div.title没有文字,我想隐藏.

我不知道如何在JQ中这样做.谢谢!!!

Answer 1

有:empty选择器:

$('li.GRID_ITEM:has(div.title:empty)').hide();

但要注意,:empty严格意味着没有文字(包括空格)和没有子元素.如果要处理包含空格或子元素的个案,请使用:

$('li.GRID_ITEM').filter(function () {
    return $.trim($(this).find('div.title').text()).length == 0;
}).hide();

正如ŠimeVidas指出的那样,这也将隐藏任何没有子元素的父母.如果那不是您想要的,您可以尝试此变体,另外检查子元素是否存在:

$('li.GRID_ITEM').filter(function () {
    var title = $(this).find('div.title');
    return title.length && $.trim(title.text()).length == 0;
}).hide();