jQueryフィルタ関数は、一致するセレクタまたは関数のテストを使用して、一致する要素のセットから要素を抽出するのに便利な機能です。
1.フィルター（セレクター）
一致する要素のセットで、filter（）セレクタにのみ一致する要素を取得します。
例えば、
$("div").filter("#div1").css('background-color', 'blue');
すべてのdiv要素を一致させ、idが “div1″であるdiv要素を選択し、要素の背景色を青に変更します。
2.フィルター（関数）
一致する要素のセットで、関数のテストに合格する要素を取得します。この関数は、一致する要素のインデックスを表すindexパラメーターを内部で渡します。カウントは0からカウントされます。
例えば、
$('div').filter(function(index) {
if(index==2 || index==3){//0 index based
return true;
}
}).css('background-color', 'blue');
すべてのdiv要素を一致させ、3番目（2）と4番目（3）のdiv要素のみを選択する関数でフィルタします。
$('div').filter(function(index) {
return $("b", this).length == 1;
}).css('background-color', 'blue');
すべてのdiv要素を一致させ、<b>タグを含むdiv要素を選択する関数でフィルタします。
jQuery filter（）の例
<html>
<head>
<title>jQuery filter example</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
</head>
<body>
<h1>jQuery filter example</h1>
<script type="text/javascript">
$(document).ready(function(){
$("#filterSelector").click(function () {
$('div').css('background-color', 'white');
$("div").filter("#div1").css('background-color', 'blue');
});
$("#filterFunction").click(function () {
$('div').css('background-color', 'white');
$('div').filter(function(index) {
if(index==2 || index==3){//0 index based
return true;
}
}).css('background-color', 'blue');
});
$("#filterFunction2").click(function () {
$('div').css('background-color', 'white');
$('div').filter(function(index) {
return $("b", this).length == 1;
}).css('background-color', 'blue');
});
});
</script>
</head><body>
<div id="div1">
<b>This is div 1 with 'b' tag</b>
</div>
<div id="div2">
This is div 2
</div>
<div id="div3">
<b>This is div 3 with 'b' tag</b>
</div>
<div id="div4">
This is div 4
</div>
<br/>
<br/>
<br/>
<input type='button' value='filter(selector)' id='filterSelector'>
<input type='button' value='filter(index)' id='filterFunction'>
<input type='button' value='filter(index)+b' id='filterFunction2'>
</body>
</html>
