DOM（Document Object Model）とは

**DOM（Document Object Model）**は、Web上の文書のコンテンツと構造からなるオブジェクトのデータ表現です。

HTMLやXML文書のためのプログラミングインターフェイスで、JavaScriptから文書構造、スタイル、内容を変更することができます。

ドキュメントツリー

DOMは、HTML文書をドキュメントツリーとして扱います。

たとえば、下のようなHTML文書があれば、DOMは下の図のようなツリー構造として解釈されることになります。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	
  <title>JavaScript演習１</title>
</head>
<body>
  <h1>JavaScript</h1>
  <section>
    <h2>JavaScriptとは</h2>
    <p>JavaScriptは...</p>
  </section>
</body>
</html>

Untitled

文書に含まれる要素や属性、テキストをそれぞれオブジェクトとみなし、オブジェクトのことをノードと呼び、オブジェクトの種類に応じて要素ノード、属性ノード、テキストノードなどと呼びます。

それぞれのノードは、ツリー構造上での上下関係によって、親ノード、子ノード、兄弟ノードと呼ばれることもあり、これらはルートノードを除いて相対的なものとなります。

Document