ホームページ > ウェブフロントエンド > jsチュートリアル > jQuery_jqueryでのfilter()メソッドの使用例

jQuery_jqueryでのfilter()メソッドの使用例

WBOY
リリース: 2016-05-16 16:22:03
オリジナル
1213 人が閲覧しました

このメソッドは、指定された式またはメソッドの戻り値に一致する要素または要素のコレクションをフィルターで除外できます。

文法構造 1:
指定された式に一致する要素のセットをフィルターで除外します。

コードをコピーします コードは次のとおりです:
$(selector).filter(expr)

パラメータリスト:

参数 描述
expr 字符串值,用于筛选当前元素集合的选择器表达式。

コード例:

コードをコピーします コードは次のとおりです:



<頭>


filter() 関数 - スクリプト ホーム

<スクリプトタイプ="text/javascript">
$(document).ready(function(){
$("li").filter(".js").css("color","blue")
})





  • HTML ゾーン

  • JavaScript ゾーン

  • Div CSS ゾーン

  • JQuery ゾーン





このコードは、クラス名 js の li のフォントの色を青に設定します。

文法構造 2:

指定された jquery オブジェクトを要素コレクションからフィルターで除外します。

コードをコピーします コードは次のとおりです:
$(selector).filter(element)

パラメータリスト:

参数 描述
element 用于匹配当前元素集合中元素的jQuery对象或者DOM对象。

コード例:

例 1:

コードをコピーします コードは次のとおりです:



<頭>


filter() 関数 - スクリプト ホーム

<スクリプトタイプ="text/javascript">
$(document).ready(function(){
$("li").filter(document.getElementById("js")).css("color","blue")
})





  • HTML ゾーン

  • JavaScript ゾーン

  • Div CSS ゾーン

  • JQuery ゾーン





例 2:

コードをコピーします コードは次のとおりです:



<頭>


filter() 関数 - スクリプト ホーム

<スクリプトタイプ="text/javascript">
$(document).ready(function(){
$("li").filter($($("li")[0])).css("color","blue")
})





  • HTML ゾーン

  • JavaScript ゾーン

  • Div CSS ゾーン

  • JQuery ゾーン





文法構造 3:

指定された関数の戻り値に一致する要素のセットをフィルターで除外します。
filter() メソッドは、内部的に各オブジェクト ($.each など) に対して 1 回計算されます。呼び出された関数が false を返した場合、要素は削除され、それ以外の場合は保持されます。

コードをコピー コードは次のとおりです:
$(selector).filter(function())

パラメータリスト:

参数 描述
function(index) 定义返回filter()匹配值的函数。
index为当前元素在匹配元素集合中的索引值。

コード例:

コードをコピーします コードは次のとおりです:



<頭>


filter() 関数 - スクリプト ホーム

<スクリプトタイプ="text/javascript">
$(document).ready(function(){
$("ul").filter(function(index){
$(".js",this).length==0;
を返す }).css("色","青")
})





  • HTML ゾーン

  • JavaScript ゾーン

  • Div CSS ゾーン

  • JQuery ゾーン



  • フォントが青になります





この記事が皆さんの jQuery プログラミングに役立つことを願っています。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート