DOM
Eventが一通り終わったので、DOM(Document Object Model)にはいる。
Ajaxでは、このDOMプログラミング+CSSが基本、これに動きを加えるために、Eventやリスナといったものが存在する。「動き」を具現化するものをイベントハンドラー(Event Handler)と呼ぶ。
したがって、HTMLは以下のような、DIV要素をだらだらと書いて、CSSで整形することになる。
<DIV id="a" class="b"> … </DIV>
イベントハンドラーは、このDIV要素を捕まえて、なんらかの挙動を示すのであるが、JavaScriptで標準的に用意されているのが、
var el = ducument.getElementById("a");
というdocumentオブジェクトのgetElementByIdメソッド。
このメソッドは、id属性がaの要素をオブジェクトとして捕まえにいく。上の例では、最初に書いたDIVタグで囲まれた要素が捕らえられる。
要素の捕らえ方のくわしくは、Moziilaの記事「Using the W3C DOM」を参照。
Ajaxライブラリでは、この部分が簡単に記述できたり、他の捕捉方法が定義されたりしている。
属性の操作なども、ドット演算子の連鎖( "method1().method2()"の形式で、method1の結果にmethod2を適用すること)が使えたりする。
ということで、前置きが長くなってしまったが、DOMはAjaxライブラリの肝の部分なので、YUI2.6.0でも概観しておかなくては、ならない。