読者です 読者をやめる 読者になる 読者になる

思考停止するな

ネットワークとかアプリケーションとかWebとか

DOMとは

スポンサーリンク

DOMとは、Document Object Modelのこと。
プログラムでHTMLやXMLを扱うための仕様(API)です。
HTMLの

<p>

<img>

などの要素にアクセスする仕組みのこと。
JavaScriptを使ってHTMLを操作することができます。

xmlやhtmlドキュメントをツリー構造として表現したものをDOMツリーという。

次のようなHTMLを例として考える。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>テスト</title>
  </head>
  <body>
    <table border="1" id="test">
      <tr>
        <td>あいうえお</td>
        <td>かきくけこ</td>
      </tr>
      <tr>
        <td>さしすせそ</td>
        <td>たちつてと</td>
      </tr>
    </table>
  </body>
</html>

すると、このHTMLのDOMツリーは以下のようになる。
f:id:shimonss:20160803205135p:plain

また、DOMツリー内の各要素はノードという。

どうやってJavaScriptからHTMLのDOMを扱うかというかというと次のようにして扱います。
testというidが割り当てられているとすると、

document.getElementById('test');

のようにして要素を取得できる。