HTML で一意の ID が必要な場合、jQuery を使用して重複する ID を持つ要素を選択するにはどうすればよいでしょうか?

jQuery を使用した重複 ID を持つ要素の選択

HTML では、ID は要素の一意の識別子であることを意味します。ただし、複数の要素が同じ ID を持つ可能性があるシナリオもあります。これは有効な HTML とはみなされませんが、従来のコードベースやサードパーティのソリューションで時々発生することがあります。 jQuery には、このような状況に対処するための 2 つのオプションが用意されています。

オプション 1: 一意の ID セレクターを使用する

重複した ID を変更できない場合は、次のオプションを使用できます。同じ ID 属性を持つ要素を選択するための回避策:

jQuery(document).ready(function() {
    jQuery('[id=carousel]').jcarousel();
});

このセレクターは、名前が 'id' で値が 'carousel' の属性を持つすべての要素と一致します。このアプローチは、特異性と DOM 操作に関する問題を引き起こす可能性があるため、推奨されないことに注意してください。

オプション 2: 共通クラス名の使用

推奨されるアプローチは次のとおりです。機能を共有する必要があるすべての要素に共通のクラス名を割り当てます。これにより、選択がクラスに基づいて行われるようになり、ID の一意性要件によって制限されなくなります。

jQuery(document).ready(function() { 
    jQuery('.carousel').jcarousel();
});

提供された HTML コードで、2 番目のカルーセルの ID を一意の値に変更できます。または、両方のカルーセルに共通のクラス名を付けます。これにより、jQuery は「jcarousel」プラグインを両方の要素に適切に適用できるようになります。

以上がHTML で一意の ID が必要な場合、jQuery を使用して重複する ID を持つ要素を選択するにはどうすればよいでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。