◆連載ブログの バックナンバーはコチラ おことわり コメント、およびトラックバックは、エキサイト株式会社にて、当ブログへのコメント、およびトラックバックとしてふさわしいか、誹謗中傷や公序良俗に反する内容が含まれていないかどうかを確認致します。内容により予告なく削除する場合もございますので予めご了承ください。
こんにちは、(主に)LDサービスのインターフェース部分に携わらせてもらっている油井です。 現在ホットな JavaScript-library の一つとして「jQuery」の名をあげることができますが、このライブラリのプラグインとして動作するjTemplatesというHTMLテンプレートエンジンにも、(個人的にはですが)注目しています。 http://jtemplates.tpython.com/ そこで、以下、私がjTemplatesを触ることにより知り得た『jTemplatesでHTMLを書くときに知っておきたい8つのこと』について言及していきたいと思います。 ※ 今回の記事では「jQuery1.2.1-非圧縮版」そして「jTemplates0.5.0-非圧縮版」を使用することを想定しています。 1, (特殊変数である)$Qの正体 jTemplatesには$Tと$Pそして$Qという特殊変
jTemplates は、テンプレートから HTML を生成するためのテンプレートエンジンです。jTemplates は jQuery プラグインという形式で提供され、jQuery の特性を活かした使い方ができるのが特徴です。 一般的に jQuery を使うなかで、テンプレートエンジンが必要となるケースは少ないという印象があります。が、旧バージョンの The geo microformat 生成ツール を開発したとき、jQuery を使った DOM 操作よりも、テンプレートの文字列から HTML を生成する方が、目的に適う場合もあったので、その事例を紹介します。 次のように、The geo microformat 生成ツールは、JavaScript を使って HTML を生成し、その HTML を貼り付けコードとして表示します。 jQuery は DOM 操作を得意としますが、このような
jQueryのプラグインにjTemplatesなるテンプレートエンジンがあったので使ってみる。 tpython.com - このウェブサイトは販売用です! - tPython technologie web20 ajax opensource javascript リソースおよび情報 ということで Json.NETをさわってみるで書いたJSONデータをjQueryで加工して、HTMLに整形するコードをjTemplatesを使って書き直してみる。取り扱うJSONデータは以下↓ [{"ID":1,"Name":"ジョン"},{"ID":2,"Name":"ボブ"},{"ID":3,"Name":"ジャック"},{"ID":4,"Name":"ディラン・マッケイ"}] 以前は、 $.each(data, function(i, customer) { $("#dataTable").ap
Javascriptのテンプレートエンジン、jTemplatesを使っています。 ちょっとはまったとこをメモ。 jTemplatesの#foreachの中で、もともとテンプレートに渡されたdataのループオブジェクト以外の参照をしたいときが、あります。 代表的なのはコンボボックスのデータのセットとかです。 普通の感覚でやろうとすると、いきなりツマづきます。 sample.js var data = { optionCode : 2 optionMap : { 1 : "あああ", 2 : "いいい", 3 : "ううう" } }; $("#form").setTemplateURL("select.tpl"); $("#form").processTemplate(data); select.tpl .... <select> <option{#if $T.optionCode}{
Home はまったので忘れないうちにメモ。 $(“#piyopiyo”).processTemplate(data) とかやると、id=“piyopiyo”な要素の内容が全部置き換わってしまうので、古いデータが消えてしまう。たとえばTwitterクライアントみたいなものを作ろうと思ったら、定期的に新しいtimelineをとってきたら、古いデータを残しつつ、新しいものだけ上に出てきてほしい。 以下のようにすることで、id=“piyo”配下のclass=“moge”にデータがたまっていく。空のdivを一個用意して、そこにprocessTemplateで新しいデータを入れていく。@hideaki_t、ありがとうございました。 <html> <head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <scrip
最近javascriptをさわり始めておりまして、そうすると動的にデータを操作するのでjTemplatesというテンプレートエンジンを使う事にしました。jQueryのプラグインだという事と、1つのファイルで複数のテンプレートを定義出来るという事で選んだわけですが、「複数テンプレート」のニュアンスがちょっと思ってたのと違うのでメモ書きです。 サーバーサイドのテンプレートエンジンはページ単位が多いわけですが、javascriptで動的に入れ替えたいのはページ単位というよりは、HTMLのブロック要素単位だと思います。なのでページ単位で作ったテンプレートファイルの中にブロック用のテンプレートを複数持たせたいのです。 まずjTemplatesの基本的な使い方は以下のような感じで、テンプレートを特定のブロックにセットして、データと一緒にprocessTemplateを走らせるという流れになります。
JavascriptでTemplate Engineっぽいことを使いたくなったので、 既存のライブラリについて、調査したので、備忘録的にメモ。 要求としては以下の通り。 簡単(理解しやすい、直感的な文法) 軽量 ちゃんとメンテナンスされている ドキュメントが豊富 Jqueryと競合しない 選択肢としては、以下のライブラリを見つけた。 EJS jquery pluginではない。競合するかは未確認 ドキュメントは豊富 MIT License 13KB Rails的文法( <% %> , <%= %>) シンプル Chain.js テンプレートにタグを埋めるのではなく、Javascriptでなんとかしちゃう系の文法 jquery pluginである 表示したHTMLに対して、さらにJavascriptのマウスイベントをつける場合などは便利かも ドキュメントは多くない メンテはされているっぽい
Javascriptのテンプレートエンジンっぽいものはいくつかあるみたいですが、今回はjQueryプラグインのjTemplatesを使ってみてちょっとはまったところをメモしておきます。 Javascriptのテンプレートエンジンについてはこちらでまとめられています。 http://tanarky.blogspot.com/2009/11/javascript-template-engines.html jTemplatesの本家ページ http://jtemplates.tpython.com/ 試しにYahooのAPIを叩いてみます。 サンプルのソースコードは以下の通り <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>
当サイトではCookieを使用しています。引き続き当サイトを閲覧することにより、ポリシーを受け入れたものとみなされます。今後表示しない詳しく見る
Eclipse.orgのトップページがHeliosモードになっています。なんか黄色いです。 http://www.eclipse.org/ 新機能の解説はid:kompiroさんのところが詳しいです。 http://d.hatena.ne.jp/kompiro/20100622/1277219101 マイコミジャーナルのIDE連載でもHeliosは取り上げようと思っていたのですが、ここまで書かれてしまうとわざわざ記事で書くこともないかなぁ、という気がしますw Pleiades All in OneのHelios版も早速リリースされた模様。 http://d.hatena.ne.jp/cypher256/20100623/p1 Eclipseはこの数年、どちらかといえばバックエンドの改良が多く、直接使い勝手に影響するような大きな新機能があまりないのが残念なところです。仕事や執筆の関係で複数の
後数時間でいよいよEclipse3.6(Helios)がやってきます。(ただいまFriends of Eclipse権限でダウンロード中)今回のリリースでは、39個のプロジェクトが同時リリース。そして初めてe4も同時にリリースです。e4については、後日レポートします。(がんばる)簡単に触れると、e4は、Eclipseの次期バージョンを目指し、開発が進んできたIDEです。Eclipse Platformの開発にて、初めてコミュニティが主体になって進めてきたプロジェクトです。新たな開発プラットフォームとなるべく開発が進んでいます。Eclipse 3系の中心のorg.eclipse.uiはかなり巨大なBundleに成長してしまいました。その中でも特に重要なクラスであるWorkbenchクラスの実装コードは5000行(!)近く、改善を加えるにも結構限界があったんではないか、と思われます。e4では「
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く