JavaScript で getElementById() を使用して、同じ ID を持つ複数の要素を取得するにはどうすればよいですか?

getElementById を使用した同じ ID を持つ複数の要素の取得

JavaScript では、getElementById は一意の ID に基づいて要素を選択するための強力な方法です。ただし、同じ ID を共有する複数の要素が見つかった場合、これは無効な HTML ですが、場合によっては避けられない場合はどうなりますか?

次の質問は、このシナリオに対処します:

質問: 方法ID 属性を指定して要素のコレクションを取得できますか? (重複 ID を持つ要素も含む)これを実現するには getElementById() のみを使用したいと考えています。

答え:

重複した ID を持つ要素に getElementById() を使用するのは理想的ではありませんが、次の方法があります。この問題を回避してください。 1 つの方法は、querySelectorAll を使用することです:

var elms = document.querySelectorAll("[id='duplicateID']");

for(var i = 0; i < elms.length; i++) 
  elms[i].style.display='none';

このコードは、指定された ID を持つすべての要素を取得し、elms という名前の配列に格納します。その後、配列を反復処理して、各要素に対して必要なアクション (上記の例では要素を非表示にするなど) を実行できます。

重複する ID を持つ要素に getElementById() を使用すると、予期しない動作が発生する可能性があることに注意してください。一般に、要素に一意の ID を使用して有効な HTML を適用することをお勧めします。

以上がJavaScript で getElementById() を使用して、同じ ID を持つ複数の要素を取得するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。