TL;DR
HTML などの文書の構造を、ノードとオブジェクトからなる木としてメモリ上に表し、プログラムから操作できるようにするモデルと API。仕様は WHATWG の DOM Standard で定められている。
なぜ必要か
MDN によると、DOM は Web ページとスクリプトやプログラミング言語をつなぐ。文書をノードとオブジェクトとして表すので、プログラムからページを読み書きできる。
仕組み
DOM Standard によると、DOM はイベント、処理の中断、ノードの木について、プラットフォームに依存しないモデルを定める。木は有限の階層構造で、各オブジェクトは親と、順序の付いた子のリストを持つ。イベントを受け取れるオブジェクトは EventTarget である。
MDN によると、ブラウザは HTML を解析して DOM ツリーを作り、それを使って文書を表示する。DOM は特定のプログラミング言語に依存しないように設計されているが、Web 開発ではほとんど JavaScript から使う。
例
const paragraphs = document.querySelectorAll("p")
alert(paragraphs[0].nodeName) // 最初の <p> 要素TypeScript は、window や document などの DOM API の型を標準で同梱している。Effective TypeScript の項目 75 によると、DOM の型は EventTarget、Node、Element、HTMLElement の順に階層になっていて、具体的な要素の型が分からずにエラーになることがある。
注意点
Node.js には DOM API がないので、React のコンポーネントをテストするときは、jsdom や happy-dom のような DOM API をシミュレートするライブラリを使う（Testing Library）。
2019 年には、HTML と DOM の仕様策定を W3C ではなく WHATWG が主体となって行うことが発表された。