jQuery の each() メソッドを使用して、同じクラスの HTML 要素を反復処理する方法

jQuery を使用した同じクラスの HTML 要素のループ

同じクラスの一連の HTML 要素を効率的に走査するために、jQuery はeach() メソッド。このメソッドは、DOM 要素の便利な反復ソリューションとして機能します。

each() の使用法を示すために、次のシナリオを検討してください。

複数の

があるとします。 Web ページ上の要素には、それぞれ「証言」クラスが割り当てられます。 jQuery を使用してこれらの要素を 1 つずつ反復処理し、各要素に基づいて特定のアクションを実行する必要があります。

これを実現するための jQuery コードは簡単です。

$('.testimonial').each(function(i, obj) {
  // Perform your actions here
});

各要素内( ) 関数では、最初のパラメーター (「i」) はクラス「testimonial」を持つ要素の配列内の現在の要素の位置を表し、2 番目のパラメーター (「obj」) は現在の要素の DOM オブジェクトを表します。要素を操作するには、jQuery ラッパー $(this) を利用できます。

たとえば、各要素に特定の条件が当てはまるかどうかを確認したい場合は、それぞれの要素内に if ステートメントを追加できます。 () function:

$('.testimonial').each(function(i, obj) {
  if ($(this).hasClass('active')) {
    // Perform actions for elements with class 'active'
  }
});

jQuery API ドキュメントには、 each() メソッドに関する包括的な情報が記載されています。詳細なガイダンスと例については、公式ドキュメントを参照してください。

以上がjQuery の each() メソッドを使用して、同じクラスの HTML 要素を反復処理する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。