querySelectorAllメソッド

querySelectorAllメソッドを使用すると、 任意のCSSセレクターでページ上の要素を 取得できます。取得した要素に対しては、 テキスト、属性、CSSスタイルなどを変更するなど、 様々な操作を行うことができます。

構文

javascriptdocument.querySelectorAll(selector);

例

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

html<p class="www">要素 1</p>
<p class="www">要素 2</p>
<p class="www">要素 3</p>

javascriptlet elems = document.querySelectorAll('.www');

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

コード実行結果：

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

関連項目