GreaseMonkey の user script を書いていると、ちょこちょこと HTML を出力する必要に迫られます。
PHP の here document のようなズボラなことがやりたいんですけど、JavaScript でのやり方が分からず、イチイチ [cci]+[/cci] で連結していたんですが、行をまたぐこともできない(正確には行末に [cci]\[/cci] を付加してやればいいみたい。AppleScript の [cci]¬[/cci] のようなもの?)ので、かなりかったるかったわけです。
で、人様のコードを見ていたら、素でタグが埋め込んであって、便利そうなのでまねして見たけど、うまくいかなくて、その原因が分からず、ずっと放置していたんですが、今日ひょんなことから E4X という語を知り、急に世界が広がりました。
さまよっていたら、 http://gihyo.jp/dev/feature/01/greasemonkey/0002 を見つけたんですけど、今までうまく行かなかったのは、
- [cci_html][/cci] とすべきところが、[cci][/cci] だったり(要するに閉じていない)して、xml でなかった。
- テキストが求められている部分で、[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 +=
;
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
にほんブログ村 ライフスタイルブログ 薪ストーブ暮らしに参加しています。 励みになりますので、足あとがわりに、ランクアップにご協力下さい。 |