特定のhtml値を持つ子要素を含む要素を取得するJquery

Question

jqueryを使用して、html/valがゼロに等しい「span」要素を含む「li」要素にクラスを追加したいとします。私は、要素の属性値をチェックするためのコードを使用していた過去に

<ul> 
    <li><span>Item 1</span><span class="num">30</span></li> 
    <li class="disabled"><span>Item 2</span><span class="num">0</span></li> 
    <li><span>Item 3</span><span class="num">20</span></li> 
</ul> 

が、例えば：

私のコードは次のように見える場合：私は次のように変更したい

<ul> 
    <li><span>Item 1</span><span class="num">30</span></li> 
    <li><span>Item 2</span><span class="num">0</span></li> 
    <li><span>Item 3</span><span class="num">20</span></li> 
</ul> 

この効果に何かをしているhtml/valは決してありません...

$('li').has('span.num').addClass('disabled'); 

しかし、この場合結果内：明らかに作業を行っていない

<ul> 
    <li class="disabled"><span>Item 1</span><span class="num">30</span></li> 
    <li class="disabled"><span>Item 2</span><span class="num">0</span></li> 
    <li class="disabled"><span>Item 3</span><span class="num">20</span></li> 
</ul> 

...おかげ

Answer 1

これは、あなたが欲しいものを行う必要があります。

$('li').each(function(){ 
    if($(this).find('span.num').text() == '0') $(this).addClass('disabled') 
}); 

JS Fiddle

は、私は次のよう提案しているだろう：

$('li').has('span.num:contains(0)').addClass('disabled') 

をしかし、それは価値がHTML内に存在するかどうかをチェックするように、それは、動作しません - ではない正確に一致します。この場合、span.num要素のそれぞれに0があるため、すべてのliは選択されたクラスを取得します。 ：contains（）セレクタに対応するequals（）のようには見えません。 jsFiddle exampleで

$('li .num').each(function(){ 
    if ($(this).text() == '0') $(this).parent().addClass('disabled'); 
}); 

：

Answer 2

試してみてください。

$('li span.num').filter(
    function(i){ 
     return $(this).text() == '0'; 
    }).closest('li').addClass('selected'); 

JS Fiddle demo。

Answer 3

これを試してください。

$('ul span.num').filter(function(){ 
    return $(this).text() == "0"; 
}).parent().addClass('disabled'); 

Demo

Answer 4

あなたはparent()とその親<div>を取得し、その後、filter()で<span>要素を一致させることができます：

$("li > span.num").filter(function() { 
    return $(this).text() === "0"; 
}).parent().addClass("disabled"); 

Answer 5

ここではそれまでに高速な方法です。