querySelectorAllも使ってみた！styleプロパティで装飾変更！forEachで複数要素操作（字幕あり）【#04 JavaScript入門 〜DOM操作編〜】

前回の動画で解説した、DOMの操作 〜innerHTMLプロパティ〜についての続きです。DOMから複数のp要素をclassセレクタで一気に取得して、それぞれのstyleプロパティで要素の装飾を変更する方法について解説しています。querySelectorAllメソッドやforEachメソッドの使い方なども解説しています。

#03 JavaScript入門 〜DOM操作編〜】querySelectorメソッドを使ってみた！innerHTMLを操作してタグの中身を書き換えよう！（字幕あり）
https://youtu.be/DIzYDdJvTOY
の続きです。

★目次
0:00 はじめに　
0:29 プロパティの操作
2:38 ライブコーディング
4:21 querySelectorAllで複数要素を取得
5:35 for文を使って装飾を変更
7:29 for文をforEachメソッドに変更してみた
10:04 まとめ
10:43 エンディング

動画内で作成したプログラムをGitHubにアップしました！
https://github.com/mojyamojya/html-css-javascript/blob/master/style.html

何かの参考になれば幸いです。
たくさんのコメントお待ちしています！
よろしくお願いします！


【自己紹介】
毎年4〜6月は、研修で40人くらいの新社会人にプログラミングを教えています。普段はWebエンジニアですが、Lineスタンプを作ったりスマホアプリを作ったり動画制作をするなど、好きなことをやってます。
受講生が成長していく姿を見るのが好きです！

プログラミング習得に挫折してしまったことはありませんか？
ややこしい専門用語だったり、同じものを場面によって違う呼び方をする、など...私はこれがプログラミングをよりわかりづらくしてしまっている一つの要因だと考えています。
なるべく平たい言葉で、「いかに簡単に表現するか」ということを心がけて講義をしています。

Webサイトの開発では、Spring Boot(Java)、Laravel(PHP)、Vue.jsなどのフレームワークを使ったものや、WordPressテーマのカスタマイズ、AWSのサーバ保守などが多いです。

趣味は、剣道／サーフィン／YouTube。
剣道では子どもたちの指導もしています！


【HTML/CSS/JavaScript プログラミング教室】
★学習に時間が取りづらくてもコツコツと進めていきたい人向けのオンライン動画
好きな時間に好きなところを何度でも繰り返し受講することが可能です。
https://www.udemy.com/course/htmlcssjavascript/


★短期集中で一気に習得したい方向けのオンラインレッスン
Zoomでリアルタイムに受講するオンライン講座なので、直接講師に質問することが可能です。4,000円 OFF優待！

・昼の部
Udemyと同じ講義をたった2日間で学べます。
https://www.street-academy.com/myclass/90611?d_code=cxlFaJTe

・夜の部
夜の隙間時間を使って4日間で同様の講義を受けられます。
https://www.street-academy.com/myclass/91830?d_code=tah2DNeO


-----------------------------------------------------------
★講師のSNS関連
Twitter
https://twitter.com/mojyamojya