jQuery でデータ属性に基づいて要素をターゲットにして操作する方法

jQuery でのデータ属性値による要素の検索

類似した構造とデータ属性を持つ複数の要素があります。タスクは、データ属性値に基づいて特定の要素をターゲットにして操作することです。

今回の場合、データ スライド属性値 0 を持つクラスを要素に追加します。これを実現するには、次のようにします。 jQuery の Attribute Equals Selector 構文を利用できます。

解決策:

説明:

1. 属性が等しいセレクター: [attribute="value"]: 指定された属性と値に基づいて要素を選択します。ここで、[data-slide="0"] は、値 0 の data-slide 属性を持つ要素と一致します。
2. addClass() メソッド: に新しい CSS クラスを追加します。選択した要素。この場合、 .addClass('active') はアクティブ クラスを要素に適用します。

find() メソッドとの比較:

以前のfind() メソッドを使用しようとしましたが、Attribute Equals Selector とは動作が異なります。 find() は、指定されたセレクターに一致する、選択された要素の子孫を検索します。このコンテキストでは、data-slide 属性値 0 を持つ子要素が検索されますが、これは意図したものではありません。

Fiddle Demo:

[Example]フィドルのデモ](https://jsfiddle.net/example-of-attribute-equals-selector/)

以上がjQuery でデータ属性に基づいて要素をターゲットにして操作する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。