ホームページ > ウェブフロントエンド > フロントエンドQ&A > jquery属性フィルターには次のものが含まれていません

jquery属性フィルターには次のものが含まれていません

PHPz
リリース: 2023-05-18 17:55:38
オリジナル
1092 人が閲覧しました

jQuery を学習して使用する場合、属性セレクターは非常に重要なタイプのセレクターです。属性セレクターでは、属性値に基づいて要素をフィルターできます。一般的なセレクターには、等しい、等しくない、含む、含まないなどがあります。

ただし、属性フィルターの中でも、除外フィルターは他の属性フィルターほど一般的には使用されないようです。除外フィルターは比較的複雑なフィルターであり、フィルターするには特定のセレクターを入力する必要があります。この記事では、jQuery の除外フィルターとその使用法について説明します。

1. 属性を含まないフィルターの構文

属性を含まないフィルターの構文は、他の属性フィルターの構文と似ていますが、コロン: が必要です。角括弧内。その一般的な形式は次のとおりです:

$('selector:not([attribute!=value])');

このセレクターは not() メソッドを使用します。 、フィルターをラップし、セレクターを満たすすべての要素を除外します。角括弧内で 1 つ以上のプロパティ、値、演算子を使用できます。

要素を特定の属性値に一致させたくない場合は、排他的フィルターを使用できます。角括弧内で感嘆符! を使用し、その後に等号 = を続けます。等号の後の引用符内には、一致させたくない属性値を記述することができます。

2. 非含有属性フィルターの使用

非含有属性フィルターをよりよく理解するために、いくつかの具体的な例を見てみましょう。

次の HTML コードがあります:

    <div class="example" data-value="9"></div>
    <div class="example" data-value="10"></div>
    <div class="example" data-value="12"></div>
ログイン後にコピー

次に、これらの要素の中からデータ値属性に「5」が含まれていない要素のみを選択します。これを実現するには、次のコードを使用します:

$('.example:not([data-value="5"])');

Thisデータ値属性 9、10、12 を持つ 3 つの要素を返します。これは、5 が必要のない属性値であり、not() メソッドが一致した結果を反転して必要な要素を返すためです。

次に、このセレクターを他の属性と演算子で拡張できます。たとえば、< 演算子を使用して、10 未満のデータ値属性を持つ要素を選択できます:

$('.example:not([data-value

これにより、データ値属性が 9 と 5 を持つ要素が選択されますが、10 と 12 は選択されません。

3. 概要

非含ま属性フィルターは非常に便利なセレクターであり、必要な要素をフィルターするコードをすばやく作成するのに役立ちます。少し複雑ですが、基本的な構文と使用法を理解していれば、その機能を利用してコードをより簡潔で読みやすくすることができます。

jQuery セレクターを作成する前に、構文と使用法を完全に理解し、コードをテストして正しく動作することを確認してください。この記事をお読みいただきありがとうございます。jQuery コードを作成するときに役立つことを願っています。

以上がjquery属性フィルターには次のものが含まれていませんの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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