DOM

定義

DOM（Document Object Model）は、HTML や XML 文書を、要素・属性・テキストを「ノード」とするツリー構造としてメモリ上に表現する API です。
ブラウザは読み込んだ HTML を解析して DOM ツリーを構築し、JavaScript はこのツリーを通じてページの構造・内容・スタイルを動的に操作します。

詳細

DOM はプログラミング言語ではなく、言語非依存のインターフェース仕様です。document がツリーの根で、document.querySelector() や element.appendChild() などのメソッドでノードを取得・追加・削除できます。
React や Vue.js は仮想 DOM を介して差分だけを実 DOM に適用し、手作業の DOM 操作を抽象化します。

よくある誤解

DOM は HTML そのものではありません。
HTML はテキストのソースで、DOM はブラウザがそれを解析した結果のオブジェクトツリーです。
ブラウザ拡張や JavaScript が後から DOM を書き換えると、表示中の DOM と最初の HTML が一致しなくなります。

関連

ノードへの参照を保持する ref.current が null になる問題 や、テスト環境に DOM が無い document is not defined は、いずれも DOM の有無やタイミングが論点になります。