E4X

GreaseMonkey の user script を書いていると、ちょこちょこと HTML を出力する必要に迫られます。

PHP の here document のようなズボラなことがやりたいんですけど、JavaScript でのやり方が分からず、イチイチ [cci]+[/cci] で連結していたんですが、行をまたぐこともできない(正確には行末に [cci]\[/cci] を付加してやればいいみたい。AppleScript の [cci]¬[/cci] のようなもの?)ので、かなりかったるかったわけです。

で、人様のコードを見ていたら、素でタグが埋め込んであって、便利そうなのでまねして見たけど、うまくいかなくて、その原因が分からず、ずっと放置していたんですが、今日ひょんなことから E4X という語を知り、急に世界が広がりました。

さまよっていたら、 http://gihyo.jp/dev/feature/01/greasemonkey/0002 を見つけたんですけど、今までうまく行かなかったのは、

  1. [cci_html][/cci] とすべきところが、[cci][/cci] だったり(要するに閉じていない)して、xml でなかった。
  2. テキストが求められている部分で、[cci]toSource()[/cci] せずにそのままオブジェクトを渡していた。

が原因のようです。

で、そうこうしているうちに「変数も展開したいよな」などと思い始めてググって見ました。

で、http://d.hatena.ne.jp/nitoyon/20080612/e4x_expression を発見。

うーん、今までイチイチ連結したり [cci]replace[/cci] していたのはなんだったんだろう。。。

で、毎度のことですけど、GIHYO のほうは、[cci_JavaScript]toSource()[/cci] を使っていて、nitoyon 氏のほうは、[cci_JavaScript]toXMLString()[/cci] を使っています。

野生の感が GIHYO のまねをするとロクなことがないといっているので、[cci_JavaScript]toXMLString()[/cci] を使うことにしました。

実験。

var td = ['apple','orange','banana'];
var table =

{td[0]} {td[1]} {td[2]}

;
console.log(table.toXMLString());

apple orange banana

うーん、微妙。


var td = ['apple','orange','banana'];
var table =

;
for (var i = 0; i < td.length; ++i) table.tr.td += {td[i]}

;
table.@id = 'fruits';
console.log(table.toXMLString());

apple orange banana

少しは良くなった?
なんか違う気がしないでもないけど、今までから比べたらかなりまとも!?
とりあえず、随分と前進したことは確かなようです。

ついでに備忘録。


var minutes =1;
var seconds =30;
var x = <>({minutes}分{seconds}秒後) ;
x += <>Hello;
x.toXMLString()
// (1分30秒後)\nHello

にほんブログ村 ライフスタイルブログ 薪ストーブ暮らしへ
にほんブログ村 ライフスタイルブログ 薪ストーブ暮らしに参加しています。 励みになりますので、足あとがわりに、ランクアップにご協力下さい。

Leave a Reply