JST: 2007年2月アーカイブ



JavaScript Template(JST) を使って、HTML中に直接テンプレートを記述する方法


は問題がありました。



記述したテンプレートを innerHTML として取得すると、


ブラウザがそれぞれ勝手な解釈をして「正しい」html に書き直そうとします。


結果、少なくとも以下の問題が発生します。




  • 不等号が htmlentities に変換される



{if hoge>2}${hoge}{/if}

みたいな非常によくある if 文が、



{if hoge < 2}${hoge}{/if}

↑こうなって parse error。


ただ、これくらいならソース弄って 置換してやれば問題ないです。



  • table のloop とか、実質無理。



<table>
{for val in data}
<tr><td>{val.title}</td><td>{val.value}</td></tr>
{/for}
</table>

↑こんなことしてテーブル出力したいじゃないですか。


でも、IE 様の innerHTML は </tr>と<tr>間の記述を無視してくれます。


そんな IE 様でも動かすにはこんな感じ



<table>
<!--{for val in data}-->
{for val in data}
<tr><td>{val.title}</td><td>{val.value}</td></tr>
{/for}
<!--{/for}-->
</table>

IE様 では innerHTML でも comment は 無視されない。


firefox では、innerHTML では comment は無視される。



こういうの、hack っていうの?


やってられるかっつうの。


ie、バーカ。バーカバーカ。



で、結局推奨通り 見えない textarea に入れて、value を取得することになるわけですが、


それじゃ意味ねえのよ。



デザイナさんと共同作業したいから、本来あるべきところにあってほしいわけで。


textarea に入れるくらいなら、その意味では、使わない方がマシ。


javascript でチマチマ html 組み立てる手間は省けるけどさー。



サーバサイド javascript って、そういえば昔あったなー。


それで何とかなるのかな。とも思ったけど、もう心が折れました。