JavaScript でクラス名で要素を選択するにはどうすればよいですか?

クラス名で要素を取得する方法

JavaScript では、document.getElementById() メソッドを使用すると、ID で要素を簡単に取得できます。ただし、クラスによる要素の取得は少し異なり、最初は混乱を引き起こす可能性があります。

クラスによる要素の選択の正しいメソッド名は document.getElementsByClassName() です。これは、Web ページ上の複数の要素が同じクラスを共有できるため、NodeList または配列のようなオブジェクトを返す 'Elements' が使用されるためです。

次に例を示します:

<code class="javascript">var elementsByClass = document.getElementsByClassName('class_name');
console.log(elementsByClass[0]); // Accesses the first element with the provided class name</code>

NodeList を実際の配列に変換する必要がある場合は、次のメソッドを使用できます。

<code class="javascript">var arrayFromList1 = Array.prototype.slice.call(elementsByClass);

// Alternatively, you can use the following syntax to convert the NodeList to an array
var arrayFromList2 = [].slice.call(elementsByClass);</code>

クラスごとに要素を選択するには、querySelector() または querySelectorAll() を使用するのが一般的であることに注意してください。クロスブラウザーのサポートが強化されているため、推奨されます。

最後に、正確で最新の JavaScript 情報については、MDN などの信頼できるソースを参照することをお勧めします。

以上がJavaScript でクラス名で要素を選択するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。