interlude

プログラミングや私的なこと

今更聞けないDOMのこと

web

DOM(Document Object Model)とは何か？

と聞かれて咄嗟に的確に答えられることが出来るでしょうか。私は出来ません。せいぜいjavascriptで出てくるアレでしょ？くらいにしか理解していなかったので、調べてみることにしました。

結論

結論から言ってしまうと、HTMLまたはxmlの要素を操作するためのAPIです。

APIはプログラム側からOSやwebサービス等が提供する機能を呼び出すための規約のこと。

つまり、DOMはwebページとスクリプト言語を繋ぐ橋渡しの役目を果たしています。

その前に

DOMを知る上ではHTMLについての理解が必要です。
HTMLは

タイトル < title >
見出し<h1,2,3>
文章(段落)< p >

とまさに文書そのものの作りとなっていますが、 DOMからはHTMLがツリー(木)構造として見えています。
以下はHTMLのテーブル

<TABLE>  
      <TBODY>   
      <TR>   
      <TD>Shady Grove</TD>  
      <TD>Aeolian</TD>   
      </TR>   
      <TR>  
      <TD>Over the River, Charlie</TD>  
      <TD>Dorian</TD>  
      </TR>   
      </TBODY>  
</TABLE>

このHTMLをDOMから見ると
f:id:tatsuyard:20150321143844g:plain
となります。

まとめ

要するにHTML１つ１つの要素をオブジェクト(物体)として捉えているので、Document(文書)をObject(物体)にしたModel(型)と表現しているのだと思います。

プログラムからHTML(文書)を直接操作したり変更するために生まれた仕組みがDOMなんですね。

ちなみにDOMは単体で独立した存在なので、javascriptとDOMはセットでしか扱えないということではなく、他の言語からでもDOMを操作することが可能です。

参考

http://www.doraneko.org/misc/dom10/19981001/introduction.html

導入 - DOM | MDN

http://www.w3.org/TR/DOM-Level-2-Core/introduction.html