JavaScriptのquerySelectorAllの使い方｜全要素取得

📌

結論

querySelectorAll + forEach で複数要素を一括処理

📝 実際のコードはこちら

document.querySelectorAll('.item').forEach(el => {
  el.style.color = 'blue';
});

まとめ

・querySelectorAll でNodeListを取得・forEach で1つずつ処理

querySelectorAllで全要素にスタイルを当ててみましょう。

🧪 ここで試せます ─ 壊しても大丈夫！

下のエディタで実際にコードを書いて、すぐにプレビューで確認できます。何度でもやり直せるので、思い切って色々試してみてください。

■ 演習

idがlistのul内の全liを取得し、それぞれのtextContentをconsole.logで出力してください。

詰まったらヒント

querySelectorAll('#list li')、forEach