目次

1.はじめに

JavaScriptを学び始めるとDOMという言葉に必ず出会います。
ではいったいDOMとはなんなのかという部分にこの記事では触れていきます。

DOMについて触れていきます。
DOMとは「Document　Object　Model（ドキュメントを物として扱うモデル）」の略で、
HTMLなどの文書をJavaScriptなどのプログラムで扱いやすくするためのAPIです。

DOMを利用する事で、
HTML要素の取得,ユーザの操作時の処理,イベントの設定,
見た目の変更などが主に行えます。

DOMを理解するために理解が必須となるのがDOMツリーです。
階層構造とは組織図のようなものだと考えると理解しやすいです。

（DOM上ではHTMLのタグのことをNodeと呼びます。）

下の図はブラウザ内部に構築されるDOMツリーの1例です。
DOMツリーのルートを親Node,子Node,兄弟姉妹Nodeを意識して見てみましょう。
(親Node,子Node,兄弟姉妹NodeはそれぞれHTMLの入子構造を意識しましょう！)

最後までご覧いただきありがとうございました。
それではまた別の記事でお会いしましょう〜👋