jQuery コンテントフィルタ（4） 「:has(セレクタ)」タグ

指定したセレクター要素を子孫に持つ要素を選択します。

たとえば、 $(“div:has(p.animal)”) とすると、div要素のなかからclass属性に
“animal”を持つpタグを持つものを抽出します。

以下にサンプル示します。

<title>基本フィルタ</title>



$(function(){
        $('div:has(li)').append("<p>I have li tags.</p>");
});



<h3>japan</h3>
<div id="first">
<p>zack japan</p>
<p>kamo japan</p>
<p>torushie japan</p>
</div>
<h3></h3>
<div id="second">
<p>favorit fruit</p>
<ul>
        <li>1. banana 69</li>
        <li>2. apple 148</li>
</ul>
</div>

<title>基本フィルタ</title>

$(function(){

$('div:has(li)').append("<p>I have li tags.</p>");

});

<h3>japan</h3>

<p>zack japan</p>

<p>kamo japan</p>

<p>torushie japan</p>

</div>

<p>favorit fruit</p>

<ul>

<li>1. banana 69</li>

<li>2. apple 148</li>

</ul>

</div>

ここでは、div要素の中でその子孫にliタグを持つ要素に対して、”

I have li tags.

を追加してます。

$('div:has(li)').append("<p>I have li tags.</p>");

1	$('div:has(li)').append("<p>I have li tags.</p>");

この例では、二番目のdivタグがliタグを持っているため二番目のdivタグに”

I have li tags.

“が追加されていることがわかります。
/