jQueryのfilterを拡張する方法

filterに任意のメソッドを拡張する方法

.filter() – jQuery API

Quick Tip: Dissecting jQuery – Filters を参考に、jQueryのfilterを拡張します。簡単です。

拡張コード

// 書き方1
jQuery.expr.filters.isFloatUnit = function( elem ) {
    return elem.className.match(/(image|map|youtube|eximage)-(left|right)/);
}

// 書き方2
$.extend(
    jQuery.expr[':'], {
        isFloatUnit: function( elem ) {
            return elem.className.match(/(image|map|youtube|eximage)-(left|right)/);
        }
    }
);

どちらの書き方でも拡張できます。上のサンプルは、単に要素のクラスが正規表現マッチするかどうかだけのメソッド。製品内のローカルな規則に基づいたfilterを実装できると、ちょっと便利な場面もあったりなかったり。

利用コード

// 使い方1
$(elem).children().filter(':isFloatUnit');

// 使い方2
$('div:isFloatUnit');

: ( jQuery.expr[':'] ) は、filter ( jQuery.expr.filters ) のエイリアス扱い。実装したら、あとは勝手の良い方法でフィルターを利用します。


Author

ahomuAyumu Sato

KINTOテクノロジーズ株式会社

Web 技術、組織開発、趣味など雑多なブログ。技術の話題は zenn、ご飯の話題はしずかなインターネットにも分散して投稿しています。

Bio: aho.mu
X: @ahomu
Zenn: ahomu
GitHub: ahomu
Sizu: ahomu

Related

Latest

Archives

Tags

Search