jQuery 基本フィルタ（2）　「:first」フィルタ「:last」フィルタ

そのままですが、選択された要素の中の最初と最後を表すフィルタです。

たとえば$(‘div:first’)とすれば、divタグの中で最初のものということになります。

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

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



$(function(){
        // 最初のpタグのみ文字を緑に
        $("p:first").css("color","green");

        // 最後のh3タグのみ文字を青色に
        $("h3:last").css("color","blue");
});



<h3>japan</h3>
<div id="first">
<p>zack japan</p>
<p>kamo japan</p>
<p>torushie japan</p>
</div>
<h3>fruit</h3>
<div id="second">
<p>orange</p>
<p>lemon</p>
<p>apple</p>
<p>peach</p>
</div>
<h3>animal</h3>
<div id="third">
<p>lion</p>
<p>puma</p>
</div>

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

$(function(){

// 最初のpタグのみ文字を緑に

$("p:first").css("color","green");

// 最後のh3タグのみ文字を青色に

$("h3:last").css("color","blue");

});

<h3>japan</h3>

<p>zack japan</p>

<p>kamo japan</p>

<p>torushie japan</p>

</div>

<h3>fruit</h3>

<p>orange</p>

<p>lemon</p>

<p>apple</p>

<p>peach</p>

</div>

<h3>animal</h3>

</div>

ここでは、pタグの最初の要素の文字色を緑に、h3タグの最後の要素の
文字色を青に設定しています。

$("p:first").css("color","green");
$("h3:last").css("color","blue");

1 2	$("p:first").css("color","green"); $("h3:last").css("color","blue");