とかするわけなんだけど、
良かれと思って、
Msxml2.XMLHTTP.5.0 や Msxml2.XMLHTTP.4.0 など、
ちょっとバージョンの違うものがインストールされてる環境でも
使えるようしてました。
しかし・・・

たしか、２ヶ月前くらいまでは問題なかったんですけどね、
先日、ふと自分のサイトをいろいろ見てたら
動かないところがあるんですよ～！！！
それは、Ajaxlstを実践してたところで、
調べたところ、バージョンが違うっていうエラーが出てるんですね。
まぁ、心当たりはあったので、すぐに
Msxml2.XMLHTTP.5.0 や Msxml2.XMLHTTP.4.0 ではなく、
Msxml2.XMLHTTP や Microsoft.XMLHTTP を優先して使うように変更しました。
それで、一応、サイト自体は事なきを得たわけですが、
なぜそうなったかを考えると、Windows Update しか思いつかない。
特に、IEのパッチとかだと、こっそり変更されてたり、
あるいは修正を加えた別の箇所の影響でおかしくなってたりするのかもしれない。
とりあえず、Windows Update したら、Ajax を使ってるサイトは動作確認したほうがいいと思う。

Google Maps API に表示するアイコンの画像を変更することが出来るのですが、
アイコン画像をアニメーションアイコンにすると・・・
IE ではただの画像（アニメーションしない）が、
Firefox ではアニメーションしてる！
ってことに気付いた。
まぁ、アイコンを変更しないなら関係ないことだけども。
画像の扱いが、IE と Firefox で違ってたりするので、その関係なのかなぁ～。
ただ、アニメーションさせたい！って思ってる人には、結構痛いと思ったし、痛かった。
Google Maps API でアイコンを変えたい！と思った人は、
こちらで解説しているのでどうぞ。

新潟マップ書き込め～るだ。

向こうはそんなつもりはないかもしれないが、
こちらから見れば明らかにやりたいことがかぶってる！
全く同じではないが、そんな細かいことはどうでもいい。
というか、パクられてる（？）などと思いつつも、
せっかくなので、こちらも対抗して、書き込めるようにしてみた。

データの送信にもこだわって、Ajaxにしてみた。
今回は、Google Maps API のXMLHttpを利用した。
もちろん、自前のAjaxエンジンとかあればそちらでも構わない。

新潟マップでも送信をAjaxで実行しようとしていたので、
敵に塩を送ることになるが、送信部分のみをさらしてみる。

<br /> function form_Submit(){<br /> var data = new String();<br /> for( var i = 0 ; i < document.frm.elements.length ; i++ ){<br /> if( !document.frm.elements[i].disabled ){<br /> data += "&";<br /> data += document.frm.elements[i].name;<br /> data += "=";<br /> data += document.frm.elements[i].value;<br /> }<br /> }<br /> if( data.length > 0 ){<br /> data = data.substring(1);<br /> } else{<br /> window.alert(“POSTするデータがありません。”)<br /> return false;<br /> }<br /> var request = GXmlHttp.create();<br /> if (request) {<br /> request.onreadystatechange = function() {<br /> if (request.readyState == 4 && request.status == 200) {<br /> }<br /> }<br /> request.open(“POST”, “xxx.cgi?mode=xxx”, true);<br /> request.setRequestHeader(“Content-Type” , “application/x-www-form-urlencoded”);<br /> request.send(data);<br /> }<br /> }<br />

Form の名前は frm としてます。自分のサイトに合わせて変えてくださいね。

まず、フォームfrmの内容から送信する文字列を作成します。
別に違う方法でも良いけど、まぁ参考までに。
この時に、入力チェックをしておくのも良い。
ちなみに、広島っぷではここに来る前に入力チェックは済ませています。

次に、”XMLHttpRequest”を使えるようにします。

その後、いつものように実行するのですが、

のように、”POST“にしておきます。
上記のように、”xxx.cgi?mode=xxx“のようにしておくと、
“mode“の値は”Get“データとして受け取れます。

次に、

と記述しておかないと、動かないブラウザがあるようです。
なので、必須かもね。

で、最初に作成した文字列データを送信します。
データの内容は”POST“データで受け取れます。

送信後、なんらかのデータが返ってきて、それを表示する場合には、

とかやっても良いですよ。

それはなにかっていうと、
Ajaxで読み込んだページ内のJavaScriptは動かない場合があるってこと。
ちょっと説明し難いのですが、
Ajaxで読み込んだページ内に、
例えば「ボタンを押したら動作する」とかとは違って、
読み込んだら動作するようなJavaScriptを記述していても、
動かないのです。
これはIE、Firefox共に動きませんでした。
ちなみに、昨日はテストしていないのでうろ覚えですが、
「ボタンを押したら動作する」などのイベントに起因するものは動いた・・・と思います。
では、どうすればいいのかなぁ～と思うのだけど、
Ajaxで読み込んだページを表示する前か表示した後に、
必要な処理をむりやり実行すればいいのでは？としか思いつかなかった。
例えば、その処理をfunctionとかにしておいて、
読み込んだページの表示直後に呼び出すとかね。
読み込んだページ内で実行されなくなるのなら、
親画面（Ajaxで読み込んだページを表示させる画面）に全てのJavaScriptを用意しておき、
子画面（Ajaxで読み込むページ）はデザインだけにしておくのが良いのかもしれないですね。

IEとFireFoxでは、JavaScriptが、
一方では動き、もう一方では動かなかったりという
JavaScriptの違いがあるが、それ以外にも違うことがあるのだ～！
AjaxであるHTMLを読み込んだ時、
その読み込んだHTML内でスタイルシートを宣言していた場合。
つまり、HTML内で、
<STYLE TYPE=”text/css”>
H1 { color: red; }
</STYLE>
などと記述していた場合、または、
<LINK REL=”stylesheet” TYPE=”text/css” HREF=”../css/xxx.css” />
と記述していた場合に、
IEの場合は、スタイルシートが反映されないが、
FireFoxでは、スタイルシートが反映されていた！
という違いがあった。
詳しく実験してはいないので、あまり自信満々に言い切れないのだが・・・
で、対応はというと、
読み込んだHTMLを表示するページ、まぁ要するに親ページに
<LINK REL=”stylesheet” TYPE=”text/css” HREF=”../css/xxx.css” />
と記述しておくか、もしくは、読み込むHTMLのスタイルシート適用箇所に
直接記述しておけば良い。
つまり、上の例で言うと、読み込むHTMLのH1を、
<H1 style=”color: red;”>
というようにしておけばいい。
が、これだと全ての箇所に記述しないといけないので、少々面倒になるけどね。
ということで、今回の教訓。
IEでAjaxを使う時は、スタイルシートに気をつけろ！

特に注目する要素も無いからなのだろうが、やっぱ寂しい。
なにか注目させるような要素があれば・・・
といっても、私にはAjaxしかない・・・
ん？掲示板をAjax化するとどうなるのかな？
というわけで、Ajax化してみた。
Ajax化して思ったのは、なんだかキモチイイ！ってことだった。
画面の再読み込みとかもなく、書き込み内容がスルッと追加される感じ。
書き込み後にブラウザのリロードボタンを押しても、再送されることもない。
既存の掲示板を改良するのは少々面倒だったので、
最初からAjaxを考えて作るのも良いかもしれないと思った。
もしかしたら、すでにAjax版の掲示板があるかもしれないね。

広島の、美味しい食事や楽しい食事の出来るところ等を紹介したいなと思ったので。
Googleローカルでもいいじゃん！って思うかもしれないけど、
Googleローカルはよく見ると位置がちょっと違っていたりしてますし。
それに、マーカークリックでお店へのコメントも表示させて差別化してます。
ちゃんと体験した上でのコメントなわけですし。
そして、料理が不味い、雰囲気悪いと思ったお店は紹介しません。
そのうち、お店や料理のサムネイルも表示させようかなと思ってます。
すでにいくつか撮ってきました。
もちろん、店長にサイトへの公開の許可を貰ってます。
Googleのパワーはたしかにすごいけど、
お店の写真とかまでは無理っぽいでしょ？
地方のことは地方の人にまかせなさいっ。
登録型にしても面白いかなぁ～とか、
観光スポットの紹介も面白いかなぁ～などと考えています。

今回も、前回と同様に、
XMLファイル以外に、XSLTファイルもあらかじめ用意しておき、
JavaScript内でXSLTをロードしてXMLをトランスフォーム（変換）します。

XML、XSLTは前回と同じものを使用します。

読み込み処理を行うページは下記のようにし、
ファイル名は「sample003.htm」とした。

<br /> <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”><br /> <html><br /> <META http-equiv=”Content-Type” content=”text/html; charset=utf-8″><br /> <META http-equiv=”Content-Style-Type” content=”text/css”><br /> <META http-equiv=Content-Script-Type content=text/javascript><br /> <head><br /> <title>sample003</title><br /> </head><br /> <body><br /> <!–ココにXSL適用出力が入る–><br /> <div ID=”disp”></div><br /> <!–ココにXSL適用出力が入る–><br /> <script language=”javascript”><br /> <!–<br /> function createXmlhttp() {<br /> var xmlhttp = false;<br /> try {<br /> //IE<br /> xmlhttp = new ActiveXObject(“Microsoft.XMLHTTP”);<br /> } catch (e) {<br /> xmlhttp = false;<br /> }<br /> if (!xmlhttp && typeof XMLHttpRequest!=’undefined’) {<br /> //Firefox<br /> xmlhttp = new XMLHttpRequest();<br /> }<br /> return xmlhttp;<br /> }<br /> function sample003() {<br /> var xmlhttp = new createXmlhttp();<br /> var xmlhttp2 = new createXmlhttp();<br /> var oSource;<br /> var oStyle;<br /> var disp = document.getElementById(‘disp’);<br /> if (xmlhttp) {<br /> xmlhttp.open(‘GET’, ‘sample001.xml’);<br /> xmlhttp.onreadystatechange = function() {<br /> if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {<br /> oSource = xmlhttp.responseXML;<br /> }<br /> }<br /> xmlhttp.send(null);<br /> }<br /> if (xmlhttp2) {<br /> xmlhttp2.open(‘GET’, ‘./sample002.xsl’);<br /> xmlhttp2.onreadystatechange = function() {<br /> if (xmlhttp2.readyState == 4 && xmlhttp2.status == 200) {<br /> oStyle = xmlhttp2.responseXML;<br /> var u = new Ajaxslt(oStyle);<br /> u.transformToHTML(oSource, disp);<br /> }<br /> }<br /> xmlhttp2.send(null);<br /> }<br /> }<br /> function Ajaxslt(a){<br /> this.stylesheet = a;<br /> }<br /> Ajaxslt.prototype.transformToHTML=function(a, b){<br /> if(typeof a.transformNode != “undefined”){<br /> //IE<br /> b.innerHTML = a.transformNode(this.stylesheet);<br /> }else if(typeof XSLTProcessor != “undefined” && typeof XSLTProcessor.prototype.importStylesheet != “undefined”){<br /> //Firefox<br /> var c = new XSLTProcessor();<br /> c.importStylesheet(this.stylesheet);<br /> var d = c.transformToFragment(a, window.document);<br /> b.innerHTML = “”;<br /> b.appendChild(d);<br /> }<br /> }<br /> –><br /> </script><br /> <button onclick=”sample003()”>test</button><br /> </body><br /> </html><br />

今回は、XMLを XMLHttpRequest で読み込んだ後に、
さらにXSLTも XMLHttpRequest で読み込んでいます。
読み込んだ時点で、XMLファイルとなっているので、
前回あったXSLTファイル読み込めるようにする処理
IE

Firefox

が不要になりました。

後は、今までどおり、
transformToHTML関数内で、
IEはtransformNode、
FirefoxはtransformToFragmentで
XMLにXSLTを適用し、その結果を出力しています。

今回は、XMLファイル以外に、XSLTファイルもあらかじめ用意しておき、
JavaScript内でXSLTをロードしてXMLをトランスフォーム（変換）します。

XMLは前回と同じものを使用します。

用意したXSLTはこんなかんじ。ファイル名は「sample002.xsl」とした。

<br /> <?xml version=”1.0″ encoding=”utf-8″?><br /> <xsl:stylesheet xmlns:xsl=”http://www.w3.org/1999/XSL/Transform” version=”1.0″><br /> <xsl:variable name=”key”>ASP</xsl:variable><br /> <xsl:output method=”html” encoding=”utf-8″/><br /> <xsl:template match=”/”><br /> <table border=”1″ align=”center” cellpadding=”2″ cellspacing=”0″ width=”500″><br /> <caption><b>選手一覧</b></caption><br /> <tr><br /> <th>氏名</th><br /> <th>守備</th><br /> <th>チーム</th><br /> </tr><br /> <xsl:apply-templates/><br /> </table><br /> </xsl:template><br /> <xsl:template match=”大リーグ”><br /> <xsl:apply-templates select=”選手”/><br /> </xsl:template><br /> <xsl:template match=”選手”><br /> <tr align=”center”><br /> <xsl:apply-templates select=”氏名”/><br /> <xsl:apply-templates select=”守備”/><br /> <xsl:apply-templates select=”チーム”/><br /> </tr><br /> </xsl:template><br /> <xsl:template match=”氏名”><br /> <td align=”center”><br /> <b><br /> <xsl:value-of select=”姓”/><br /> <xsl:value-of select=”名”/><br /> </b><br /> </td><br /> </xsl:template><br /> <xsl:template match=” 守備 | チーム “><br /> <td><b><xsl:value-of select=”.”/></b><br/></td><br /> </xsl:template><br /> </xsl:stylesheet><br />

読み込み処理を行うページは下記のようにし、
ファイル名は「sample002.htm」とした。

<br /> <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”><br /> <html><br /> <META http-equiv=”Content-Type” content=”text/html; charset=utf-8″><br /> <META http-equiv=”Content-Style-Type” content=”text/css”><br /> <META http-equiv=Content-Script-Type content=text/javascript><br /> <head><br /> <title>sample002</title><br /> </head><br /> <body><br /> <!–ココにXSL適用出力が入る–><br /> <div ID=”disp”></div><br /> <!–ココにXSL適用出力が入る–><br /> <script language=”javascript”><br /> <!–<br /> function createXmlhttp() {<br /> var xmlhttp = false;<br /> try {<br /> //IE<br /> xmlhttp = new ActiveXObject(“Microsoft.XMLHTTP”);<br /> } catch (e) {<br /> xmlhttp = false;<br /> }<br /> if (!xmlhttp && typeof XMLHttpRequest!=’undefined’) {<br /> //Firefox<br /> xmlhttp = new XMLHttpRequest();<br /> }<br /> return xmlhttp;<br /> }<br /> function sample002() {<br /> var xmlhttp = new createXmlhttp();<br /> var oSource;<br /> var oStyle;<br /> var disp = document.getElementById(‘disp’);<br /> if (xmlhttp) {<br /> xmlhttp.open(‘GET’, ‘sample001.xml’);<br /> xmlhttp.onreadystatechange = function() {<br /> if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {<br /> oSource = xmlhttp.responseXML;<br /> var oStyle = loadXslt(“sample002.xsl”);<br /> var u = new Ajaxslt(oStyle);<br /> u.transformToHTML(oSource, disp);<br /> }<br /> }<br /> xmlhttp.send(null);<br /> }<br /> }<br /> function loadXslt(a){<br /> try{<br /> if(typeof ActiveXObject != “undefined” && typeof GetObject != “undefined”){<br /> //IE<br /> var b = new ActiveXObject(“Microsoft.XMLDOM”);<br /> b.async = false;<br /> b.load(a);<br /> return b;<br /> }else if(typeof XSLTProcessor != “undefined” && typeof XSLTProcessor.prototype.importStylesheet != “undefined”){<br /> //Firefox<br /> var b = document.implementation.createDocument(“”, “”, null);<br /> b.async = false;<br /> b.load(a);<br /> return b;<br /> }<br /> }catch(c){<br /> }<br /> }<br /> function Ajaxslt(a){<br /> this.stylesheet = a;<br /> }<br /> Ajaxslt.prototype.transformToHTML=function(a, b){<br /> if(typeof a.transformNode != “undefined”){<br /> //IE<br /> b.innerHTML = a.transformNode(this.stylesheet);<br /> }else if(typeof XSLTProcessor != “undefined” && typeof XSLTProcessor.prototype.importStylesheet != “undefined”){<br /> //Firefox<br /> var c = new XSLTProcessor();<br /> c.importStylesheet(this.stylesheet);<br /> var d = c.transformToFragment(a, window.document);<br /> b.innerHTML = “”;<br /> b.appendChild(d);<br /> }<br /> }<br /> –><br /> </script><br /> <button onclick=”sample002()”>実行</button><br /> </body><br /> </html><br />

今回は、中盤付近にある

で、XSLTファイルを指定している。
ファイルパスは各自の環境にあわせて、変更してください。

loadXslt関数内で、各ブラウザ用の方法でXSLTを読み込んでいます。

読み込んだ後は、前回と同じ方法でトランスフォームしています。
つまり
transformToHTML関数内で、
IEはtransformNode、
FirefoxはtransformToFragmentで
XMLにXSLTを適用し、その結果を出力しています。

IEでは、

で、
Firefoxでは、

で、XSLTファイルを読み込めるようにしています。
これをやっておかないと、ロード（load）が出来ないんです。

これと似たような方法がもうひとつあるので、次回紹介します。

が、Googleのサンプルだけでは、
いくつかの必要なソースが無いこともあり、理解するのが困難だったので、
まずは、Ajaxsltを使用していると言われている Google Maps を解析してみた。

その結果、いくつかわかったことがあるので、公開してみる。

１．XMLファイルをXSLTファイルでトランスフォームする

トランスフォームってのは、XMLファイルにXSLTを
適用するっていう意味だと思えばいいかな。
トランスフォームすることで、XSLTを適用した状態のXMLを出力出来る。

２．IE と Mozilla/Firefox で異なった記述をしなければならない

XMLHｔｔｐRequest でも異なる記述が必要だったが、
ここでもやはり必要となってきた。
クロスブラウザって難しいね。

３．XSLTの生成方法がいくつかある

• JavaScriptの中に、テキストとしてゴリゴリと書いておく
• あらかじめ用意しておいたXSLTファイルを読み込む
• Google のサンプルでは、JavaScriptのコード中で生成しているようだ

残念ながら、Google のサンプルは、全てのファイルが容易されていない為、
現時点では説明出来ない。

というわけで、まずは、他の２種類の方法を説明する。

今回は、私が編み出した（といっても別にすごくもなんともなく、
ただ単にどこにもサンプルがなかっただけの）方法である、
「JavaScriptの中に、テキストとしてゴリゴリと書いておく」を説明する。

用意したXMLはこんなかんじ。ファイル名は「sample001.xml」とした。

<br /> <?xml version=”1.0″ encoding=”utf-8″?><br /> <大リーグ><br /> <選手 no=”51″><br /> <氏名><br /> <姓>鈴本</姓><br /> <名>タクロー</名><br /> </氏名><br /> <守備>ライト</守備><br /> <チーム 本拠地=”シアトル”>マリナーズ</チーム><br /> </選手><br /> <選手 no=”5″><br /> <氏名><br /> <姓>本庄</姓><br /> <名>武志</名><br /> </氏名><br /> <守備>センター</守備><br /> <チーム 本拠地=”ニューヨーク”>メッツ</チーム><br /> </選手><br /> <選手 no=”55″><br /> <氏名><br /> <姓>松田</姓><br /> <名>モジラ</名><br /> </氏名><br /> <守備>レフト</守備><br /> <チーム 本拠地=”ニューヨーク”>ヤンキース</チーム><br /> </選手><br /> </大リーグ><br />

読み込み処理を行うページは下記のようにし、
ファイル名は「sample001.htm」とした。

<br /> <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”><br /> <html><br /> <META http-equiv=”Content-Type” content=”text/html; charset=utf-8″><br /> <META http-equiv=”Content-Style-Type” content=”text/css”><br /> <META http-equiv=Content-Script-Type content=text/javascript><br /> <head><br /> <title>sample001</title><br /> </head><br /> <body><br /> <!–ココにXSL適用出力が入る–><br /> <div ID=”disp”></div><br /> <!–ココにXSL適用出力が入る–><br /> <script language=”javascript”><br /> <!–<br /> function createXmlhttp() {<br /> var xmlhttp = false;<br /> try {<br /> //IE<br /> xmlhttp = new ActiveXObject(“Microsoft.XMLHTTP”);<br /> } catch (e) {<br /> xmlhttp = false;<br /> }<br /> if (!xmlhttp && typeof XMLHttpRequest!=’undefined’) {<br /> //Firefox<br /> xmlhttp = new XMLHttpRequest();<br /> }<br /> return xmlhttp;<br /> }<br /> function sample001() {<br /> var xmlhttp = new createXmlhttp();<br /> var oSource;<br /> var oStyle;<br /> var disp = document.getElementById(‘disp’);<br /> if (xmlhttp) {<br /> xmlhttp.open(‘GET’, ‘sample001.xml’);<br /> xmlhttp.onreadystatechange = function() {<br /> if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {<br /> oSource = xmlhttp.responseXML;<br /> var a = ‘<?xml version=”1.0″ encoding=”utf-8″?>’;<br /> a += ‘<xsl:stylesheet xmlns:xsl=”http://www.w3.org/1999/XSL/Transform” version=”1.0″>’;<br /> a += ‘<xsl:output method=”html” encoding=”utf-8″/>’;<br /> a += ‘<xsl:template match=”/”>’;<br /> a += ‘<table border=”1″ align=”center” cellpadding=”2″ cellspacing=”0″ width=”500″>’;<br /> a += ‘<caption><b>選手一覧</b></caption>’;<br /> a += ‘<tr><th>氏名</th><th>守備</th><th>チーム</th></tr>’;<br /> a += ‘<xsl:apply-templates/></table></xsl:template>’;<br /> a += ‘<xsl:template match=”大リーグ”><xsl:apply-templates select=”選手”/></xsl:template>’;<br /> a += ‘<xsl:template match=”選手”><tr align=”center”>’;<br /> a += ‘<xsl:apply-templates select=”氏名”/><xsl:apply-templates select=”守備”/>’;<br /> a += ‘<xsl:apply-templates select=”チーム”/></tr></xsl:template>’;<br /> a += ‘<xsl:template match=”氏名”><td align=”center”><b>’;<br /> a += ‘<xsl:value-of select=”姓”/><xsl:value-of select=”名”/></b></td>’;<br /> a += ‘</xsl:template><xsl:template match=” 守備 | チーム “><td><b>’;<br /> a += ‘<xsl:value-of select=”.”/></b><br/></td></xsl:template></xsl:stylesheet>’;<br /> var p = createParser(a);<br /> var u = new Ajaxslt(p);<br /> u.transformToHTML(oSource, disp);<br /> }<br /> }<br /> xmlhttp.send(null);<br /> }<br /> }<br /> function createParser(a){<br /> try{<br /> if(typeof ActiveXObject != “undefined” && typeof GetObject != “undefined”){<br /> //IE<br /> var b = new ActiveXObject(“Microsoft.XMLDOM”);<br /> b.loadXML(a);<br /> return b;<br /> }else if(typeof DOMParser != “undefined”){<br /> //Firefox<br /> return(new DOMParser()).parseFromString(a, “text/xml”);<br /> }<br /> }catch(c){<br /> }<br /> }<br /> function Ajaxslt(a){<br /> this.stylesheet = a;<br /> }<br /> Ajaxslt.prototype.transformToHTML=function(a, b){<br /> if(typeof a.transformNode != “undefined”){<br /> //IE<br /> b.innerHTML = a.transformNode(this.stylesheet);<br /> }else if(typeof XSLTProcessor != “undefined” && typeof XSLTProcessor.prototype.importStylesheet != “undefined”){<br /> //Firefox<br /> var c = new XSLTProcessor();<br /> c.importStylesheet(this.stylesheet);<br /> var d = c.transformToFragment(a, window.document);<br /> b.innerHTML = “”;<br /> b.appendChild(d);<br /> }<br /> }<br /> –><br /> </script><br /> <button onclick=”sample001()”>実行</button><br /> </body><br /> </html><br />

中盤あたりにある「a」という変数に、ゴリゴリと文字列を代入している部分があるが、
その文字列こそXSLTそのものである。

記述した文字列を、XSLTとして扱えるように変換しているのが
createParserという関数での処理である。

その後、transformToHTML関数内で、
IEはtransformNode、
FirefoxはtransformToFragmentで
XMLにXSLTを適用し、その結果を出力しているというわけである。

この方法の良いところは、

• すでに用意されているXSLTを使用できる（変数に代入すればいいから）
• DOMがわからなくても、比較的容易に動的にフィルターを掛けられる

ってことしか思いつかん・・・

悪いところは、ソースが冗長になり可読性が低下しやすいところかな。
意外と使いやすいのではないかと思うけど、いかがでしょうか？