JavaScript テンプレートエンジン作成
JavaScript用テンプレートエンジン。またしょーもない物を作ってます。
まぁ、いわゆるAjax用のライブラリですね。
JSON形式のデータを渡せば、そのキーと値をそっくりそのままHTMLのテンプレートに反映させると言うだけです。
ていうか、使い所があるんでしょうか。
ま、一応、SpryBBSの管理画面に組み込もうとかフルAjaxなサイトで使う予定ではありますが。。。
一応、PerlモジュールのHTML::Templateに似た書き方にしたわけですが、、、
とりあえずHTML標準モードでの動作は何とか動いてくれてるようです。
これから嫌なバグつぶしですよ><
めんどくさーっ
<table>
<tbody>
{tpl::repeat=/users}
<tr><td>{tpl:name}</td><td>{tpl:mail}</td></tr>
{tpl::endrepeat}
</tbody>
</table>
というHTMLファイルを用意して、テンプレートエンジンに登録したあと、
var data={users:[
{name: '諸星あたる', mail: 'moroboshi@example.jp'}
,{name: '面堂終太郎', mail: 'mendo@example.com'}
,{name: '三宅しのぶ', mail: 'miyake@example.net'}
]};
こういうデータを用意して、
document.getElementById('test').innerHTML=Template.GetHTML(templateID, data);
とか
document.getElementById('test').appendChild(Template.GetDOM(templateID, data));
とすれば、画面更新完了です。
<table>
<tbody>
<tr><td>諸星あたる</td><td>moroboshi@example.jp</td></tr>
<tr><td>面堂終太郎</td><td>mendo@example.com</td></tr>
<tr><td>三宅しのぶ</td><td>miyake@example.net</td></tr>
</tbody>
</table>
というのができあがります。
サンプルページとかは後日(おぃ)