getElementsByClassNameメソッド

getElementsByClassNameメソッドは、 class 属性で指定されたクラス名によってページ要素を 取得することを可能にします。取得した要素に対しては、 テキストの変更、属性の変更、CSSスタイルの変更など、 様々な操作を行うことができます。

構文

javascriptdocument.getElementsByClassName(クラス名);

例

クラスwwwを持つすべての要素を取得し、 innerHTMLプロパティを使用してテキストを変更してみましょう:

html<p class="www">要素 1</p>
<p class="www">要素 2</p>
<p class="www">要素 3</p>
javascriptlet elems = document.getElementsByClassName('www');

for (let elem of elems) {
  elem.innerHTML = '!!!';
}

コード実行結果:

html<p class="www">!!!</p>
<p class="www">!!!</p>
<p class="www">!!!</p>

関連項目