JavaScriptを使用すると、HTMLドキュメント全体を再構築できます。ページにアイテムを追加、削除、変更、または再配置できます。ページ上の何かを変更するには、JavaScriptがHTMLドキュメントのすべての要素の入り口にアクセスする必要があります。この入り口は、HTML要素のメソッドと属性とともに、ドキュメントオブジェクトモデル（DOM）によって取得されます。 1998年、W3Cは最初のレベルDOM仕様をリリースしました。この仕様により、HTMLページで個々の要素にアクセスして操作できます。すべてのブラウザはこの標準を実行するため、DOMの互換性を見つけるのはほとんど困難です。 domは、JavaScriptがHTML、XHTML、XMLドキュメントを読み取り、変更するために使用できます。
DOMは、異なる部分（コア、XML、HTML）とレベル（DOMレベル1/2/3）に分割されます。コアドモム
構造化されたドキュメントオブジェクトの一連の標準を定義する
XML DOM
XMLドキュメントの一連の標準を定義します
HTML DOM
HTMLドキュメントの一連の標準を定義します。
ノードDOMによると、HTMLドキュメントの各コンポーネントはノードです。
DOMはこのように提供されます：
ノードは互いに階層的な関係を持っています。 HTMLドキュメントのすべてのノードは、ドキュメントツリー（またはノードツリー）を形成します。 HTMLドキュメント内の各要素、属性、テキストなどは、ツリー内のノードを表します。ツリーはドキュメントノードから始まり、ツリーの最低レベルのすべてのテキストノードがどこにでもあるまでブランチを拡張し続けます。
次の写真は、ドキュメントツリー（ノードツリー）を示しています。
ドキュメントツリー（ノードの数）次のHTMLドキュメントをご覧ください。
html; "> <html> <head> <title> dom tutorial </head> <body> <h1> domレッスン</h1> <p> </html>
上記のノードはすべて、互いに関係があります。ドキュメントノードを除く各ノードには、親ノードがあります。たとえば、<head>および<body>の親ノードは<html>ノードであり、テキストノードの親ノードは<p>ノードです。ほとんどの要素ノードにはサブノードがあります。たとえば、<head>ノードにはサブノード：<title>ノードがあります。 <Title>サブノード：テキストノードDOMチュートリアルもあります。ノードが同じ親ノードを共有する場合、それらは同じ世代（同じノード）です。たとえば、親ノードは両方とも<body>ノードであるため、<h1>と<p>は仲間です。ノードには、子孫がノードのすべてのサブノード、またはこれらのサブノードのサブノードなどを参照してください。たとえば、すべてのテキストノードは<html>ノードの子孫であり、最初のテキストノードは<head>ノードの子孫です。ノードには祖先があることもあります。祖先は、ノードの親ノード、または親ノードの親ノードなどです。たとえば、すべてのテキストノードは、<html>ノードを前身ノードとして使用できます。