JQueryはクラスのHTMLコンテンツをテストします/条件付きで要素のCSSを設定します

Question

私はクラス "eac-item"を持つdivの束を持っています。

項目の一部がコンテンツを持っている - しかし、他の人が「空白」であり、これだけを思い付く：へ：

<div class="eac-item"><br></div> 

構文は「隠されたディスプレイ」のCSSプロパティを追加するjQueryのに何だろうそれらの特定の項目？

if($('.eac-item').html() == "<br>") { {$(this).hide } ...? 

このタイプの関数の構文はどのように扱いますか？要素を非表示にする

Answer 1

次のコードは、トリック

$(".eac-item").each(function(){ 
    if ($(this).html() == "<br>") 
    $(this).hide(); 
}); 

を行う必要がありますが、私は以下のアプローチ

$(".eac-item").each(function(){ 
     if ($.trim($(this).text()) == "") 
     $(this).hide(); 
    }); 

Answer 2

一つの方法は、（display: noneを追加）each()を使用して、すべての.eac-itemを反復処理することになります。

$('.eac-item').filter(function(index) { 
 
    // Filter all elements whose only child is a <br> 
 
    return $("*", this).length === 1 && $("br", this).length === 1; 
 
}).each(function() { 
 
    $(this).hide(); 
 
});

.eac-item { border: 2px #000 solid; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="eac-item"> 
 
    <br> 
 
</div> 
 

 
<div class="eac-item">This is not hidden.</div>

あなたがしている場合は、remove()代わりのhide()を使用する場合があります実際にDOMから要素を削除しようとしています。