複数の HTML 要素が同じ ID を共有できますか?その結果は何ですか?

複数の要素は同じ ID セレクターを共有できますか?

ID 属性は一意でなければならないという W3C の明示的なガイドラインにもかかわらず、ブラウザーはしばしば重複 ID が発生した場合の動作は異なります。

提供された例は、この矛盾を示しています。2 つの要素が存在します。同じ ID を持つものは CSS セレクターに応答します。これは主に、ブラウザが HTML 標準に違反している場合でも「黙って失敗」し、開発者の意図を解釈しようとする傾向があるためです。

ただし、仕様から逸脱すると、予期せぬ結果が生じる可能性があることに注意することが重要です。 :

• document.getElementById('red') は、その要素を持つ最初の要素のみを返します。 ID。
• ブラウザの実装が異なるため、ブラウザ間の互換性の問題が発生する可能性があります。

推奨事項:

最適な結果を得るために、これは強く推奨されません。重複した ID を要素に割り当てるには。代わりに、クラス名を利用して、同じ CSS スタイルを持つ複数の要素をターゲットにします。クラスはこの目的のために明示的に設計されています。

複数 ID 選択の代替アプローチ:

どうしても必要な場合は、属性セレクターを使用して同じ ID を持つ複数の要素を選択できます。 :

document.querySelectorAll('p[id="red"]');

ただし、このアプローチは IE7 以前ではサポートされていません。

以上が複数の HTML 要素が同じ ID を共有できますか?その結果は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。