Home > 技術 > HTML文字列に値をバインドしてくれるjQuery Plugin - jTemplete

HTML文字列に値をバインドしてくれるjQuery Plugin - jTemplete

すでにjQueryのPluginとしてはjTemplates | jQuery Pluginsという立派なプラグインがあるんですが、機能が多いのでもっとシンプルにバインドだけしてくれるプラグインが欲しいと思って結構前に作ったのを公開してみます。
(とはいってもすでに誰かが作っているかもしれませんが。。。)

Ajax後にHTMLをつくり込むときに便利で、ここ最近はこのプラグインを基準にコーディングしています。

jTemplete

サンプルコード

まず$.jTemplateにHTML文字列を渡し、その中に${}を使ってJSONが持つプロパティキーを書いておきます。
そしてevaluateにAjax後に取得したJSONとかを渡して、該当のキーがあった場合に置き換わります。

このHTMLを$("wrap").html(html);とかでDOMに追加してあげればOK!!

たったこれだけの機能しかありませんが、いちいち配列にpushしていって最後にjoinしたり、+で文字列と変数をつなぎあわせたりする必要がないので、意外と便利。
ちなみにこのテンプレートは、prototype.jsのTemplete機能と同等になります。

またuupaaさんが作ったuu.snippetで「やりましょう」、Widgetの作り方入門 - latest logこちらに書かれているヒアドキュメントを使った方法も面白いですね〜!

jTempleteダウンロード

gist: 536988 - GitHub

Trackback:0

TrackBack URL for this entry
http://hisasann.com/cgi-bin/mt/mt-tb.cgi/1259
Listed below are links to weblogs that reference
HTML文字列に値をバインドしてくれるjQuery Plugin - jTemplete from HouseTect, JavaScriptな情報をあなたに

Home > 技術 > HTML文字列に値をバインドしてくれるjQuery Plugin - jTemplete

Tag cloud
月別アーカイブ
Powered by
Powered by
Movable Type Commercial 4.261

Page Top