DOM Scripting 読んでみたよ

半分まで読めたので途中ながら感想投下。期待していた内容とは違い初心者向けの XHTML/CSS/Javascript の教本的内容だった。Ajax に関しては末尾にちょこっとあるだけでほとんど触れていない。
しかし内容は秀逸。HTML, Javascript の歴史的変遷を説明した上で旧来の HTML, Javascript の組み合わせとは決別し, 新しくなった HTML, CSS, Javascript のセットは何が違うのか, どう扱えばよいのかを易しく丁寧に解説している。
例えばありがちな, 表題をクリックすると表示領域の写真が入れ替わるというスクリプティングも

<ul>
  <li><a onClick="swapImage("path to file")">Jhon Doe</a></li>
  <li><a onClick="swapImage("path to file")">Foo Bar</a></li>
</ul>
<img id="placeholder" src="default.jpg" />

ではなく

<ul id="photo_selector">
  <li><a href="path to file" class="swapImage">John Doe</a></li>
  <li><a href="path to file" class="swapImage">Foo Bar</a></li>
</ul>
<img id="placeholder" src="default.jpg" />

となる。ではイベントハンドラはどうしているのかというと

function prepareGallery() {
    if (!document.getElementsByTagName) return true;
    if (!document.getElementById) return true;
    if (!document.getElementById("photo_selector")) return true;
    var gallery = document.getElementById("photo_selector");
    var links = gallery.getElementsByTagName("a");
    for (var i=0; i < links.length; i++) {
        links[i].onclick = function() {
            swapImage(this.href);
            return false;
        }
    }
}

として DOM にアクセスし, フックしている。このやり方を見て CSS やインジェクションを思い出す人もいるかも知れない。
これで Javascript は外部に分離され HTML は Structured なデータモデルとして保たれる。この両者を粗に保つ方法論は終始貫かれ "Unobtrusive Javascript" というキーワードが繰り返し登場する。

と、新しい Tips が載っている訳ではないので「もう知ってるよ」という人が読んでも価値は薄いが、Ajax にしてもその土台となる HTML (DOM), CSS, Javascript により形成される新しいパラダイムについてこれだけ平易かつ効率的に書かれている本書はなかなかに貴重で, これから Javascript の知識を付けたい人にはお薦めと言える。
書名の DOM Scripting は DHTML に代わる Javascript/XHTML/CSS の技術総称として紹介されている言葉で、本書を読んでいくと確かに, DHTML という呼称よりは DOM と Javascript の位置が明確になる DOM Scripting という名称の方が似つかわしく思えてくる。名前大事。WaSP にも DOM Scripting タスクフォースが立ち上がっているようなのでこれからは s/DHTML/DOM Scripting/ で。