詳解JavaScript DOM編を受講が完了しました。
#ドットインストール
詳解JavaScript DOM編完了。これでHTMLが操作できるようになった。
ここまでは文法を学習する感じだったから、あとは実践形式のレッスンをこなしていく。そして模写コーディングとPHPの学習に移行していこう。#プログラミング学習 #駆け出しエンジニアと繋がりたい
— じゅに💻脱サラに命かける人 (@Jyu210) December 26, 2019
レッスン内容
DOM(Document Object Model)を使用してJavaScriptでHTMLを操作するための文法を学習します。
詳解JavaScript 基礎文法編、オブジェクト編と同様に「文法の説明→実際にコードを書く→動作確認」の順番で進んでいきます。
DOM(Document Object Model)とは
DOMは正式名称をDocument Object Modelといい、HTMLをオブジェクトのように扱い、HTMLの要差などの操作を行うことができる仕組み。
DOMそ使用してできることは以下になります。
- HTML要素を取得
- HTML要素の書き換え(値・属性など)
- HTML要素の追加・削除
- HTML要素に対してのイベント処理(マウスクリックなど)
これを利用することでHTMLを動的に変更したりすることができるようになり、Webサイトの表現の幅が広がることになります。
感想
難易度:
詳解JavaScript基礎文法編、オブジェクト編に引き続き文法の説明が中心なので、写経せずに流し見で完了させました。
ここからはHTMLの内容を変更していくので、今までのレッスンよりHTML、CSSの知識が必要にるので、難易度は上がります。
しかし、このDOMをマスターするとWebページ制作の幅がめちゃくちゃ広がります。
むしろこのDOMのためにJavaScriptを学習するといっても過言じゃないぐらいだと思ってます。
今後は実際にミニアプリ作っていくレッスンになるので、しっかりと実践して模写コーディングなどでも自主的に実践していきます。