Jintrick.netagenda2004年03月アーカイブ → 2004年03月16日

DOM仕様書入門?

DOM入門に仕様書を推奨する記事。

W3Cの勧告原文や和訳をあたってみれば間違いが無かろうと思いはしたものの、どうにも敷居が高くて挫折した。

適宜覚書: DOMツツキ より

私も挫折……というか、最初は仕様書を読んでも今一ピンときませんでした。使用例が載っていないからです。でも、それなら自分で「使用例」を作ってみれば良いのではないでしょうか。interface Documentなんてのが出てきたら、それを実際に参照してみたり作成してみたりするわけです。更にその「attributes」や「methods」も同様に。

何と言っても「勧告原文」をきちんと読めるようになるのが最良だと私は考えます。辛いかも知れませんが、その辛さを超えれば応用の幅が、他のアプローチによる理解に比べて比較になりません。次々新しい勧告が公開されるわけですから。

あるDOMのインターフェイスを理解しようとする際に私が必ずチェックするポイントは3つあります:

「1. 何を抽象化しているのか」を理解できれば、「attributes」や「methods」が自然に理解できます。言い換えると、何故その「attributes」や「methods」が存在するのかが理解できます。例えばElementインターフェイスはその名の通りXMLやHTMLの「要素」を抽象化したインターフェイスですが、 Element.setAttributeは属性を追加するメソッドであり、当然あるべきメソッドであると言えます。ちょっと違和感のあるものもありますけれども。

「2. 他のインターフェイスを継承しているか否か」を知らなければ、使用可能な「attributes」「methods」の全てが分かりません。例えばElementインターフェイスはNodeインターフェイスを継承しています。Nodeインターフェイスは要素、属性などの文書構成要素を一般的に抽象化したもので、cloneNodeという複製用のメソッドがあり、Elementインターフェイスを持ったオブジェクトでもこのメソッドを利用できます。

「3. どうやって作成或いは参照するのか」を知らなければ、そもそもそのインターフェイスを持ったオブジェクトを利用できません。例えばElementインターフェイスを持ったオブジェクトならば、 Document.createElement Document.createElementNSメソッドで作成できますし、 NodeList.item(index)等々で参照できます。仕様書を読む上で分かりにくいと思われるのはそれらの作成、参照方法を調べる方法です。手っ取り早い方法をとるなら「IDL Definition」を片っ端から調べます。

Attr                      getAttributeNode(in DOMString name);

これはElementインターフェイスのIDL DefinitionにおけるgetAttributeNodeメソッドについての定義です。メソッド名の前にAttrとありますが、これはAttrインターフェイスを持ったオブジェクトを返却するという意味です。

Attr                      createAttribute(in DOMString name)
                                            raises(DOMException);

これはDocumentインターフェイスのIDL DefinitionにおけるcreateAttributeメソッドについての定義です。同じくメソッド名の前にAttrと書かれています。

しかしこの方法では分からないものもあります。例えばHTMLHtmlElementインターフェイス(DOM Level 1 HTMLに定義されています)。しかしこれはHTML要素を抽象化したインターフェイスであり、Elementインターフェイスを継承していることが分かれば作成、参照方法も自然に理解できる筈です。つまりHTMLという名前を持ったElementを作成、参照すれば良いのです。

IDL Definitionをもっと読む

interface HTMLDocument : Document {
           attribute  DOMString            title;
  readonly attribute  DOMString            referrer;
  readonly attribute  DOMString            domain;
  readonly attribute  DOMString            URL;
           attribute  HTMLElement          body;
  readonly attribute  HTMLCollection       images;
  readonly attribute  HTMLCollection       applets;
  readonly attribute  HTMLCollection       links;
  readonly attribute  HTMLCollection       forms;
  readonly attribute  HTMLCollection       anchors;
           attribute  DOMString            cookie;
  void                      open();
  void                      close();
  void                      write(in DOMString text);
  void                      writeln(in DOMString text);
  Element                   getElementById(in DOMString elementId);
  NodeList                  getElementsByName(in DOMString elementName);
};

一行目:

interface HTMLDocument : Document

これはDocumentインターフェイスを継承したHTMLDocumentインターフェイスであることを表し、そのattribute、method群の厳密な定義がカーリブラケット{}内に記述されます。

二行目:

attribute  DOMString            title;

これはtitleという名前のattribute(JavaScriptではプロパティと呼ばれる)であることを表し、その値がDOMString型(JavaScriptではString型)であることを示しています。

三行目:

readonly attribute  DOMString            referrer;

これはreffererという名前のattributeであることを表し、readonly、つまり書き込み出来ません。値はDOMString型です。

十三行目:

void                      open();

これはopenという名前のmethodであることを表し、返り値はvoid、何も返しません。

十五行目:

void                      write(in DOMString text);

これはwriteという名前のmethodであることを表し、何も返しません。in DOMString textという部分が引数を定義します。この場合引数はDOMString型で、textで表記されています。このtextが何を意味するかは、writeメソッドの説明を読まなければ分かりません。引数が複数ある場合はカンマで区切られて列挙されます。

十七行目:

Element                   getElementById(in DOMString elementId);

これはgetElementByIdという名前のmethodであることを表し、Elementインターフェイスを持ったオブジェクトを返すことを表しています。引数はDOMString型で、elementIdで表されています。このelementIdの意味はgetElementByIdメソッドの説明を読まなければ分かりません。


webmaster@jintrick.net
公開: 2004年03月16日
カテゴリ: DOM