エピゴーネンでスマートフォン用の表示で見るエピゴーネンでこの広告は、90日以上更新していないブログに表示しています。Calendar11日目です。皆様素晴らしいエントリを書かれている中、何か初歩的なエントリでスミマセン。Backbone.jsで作られたサイトを見ると、よく_.templateを使ってHTMLを呼び出す記述を見かけますね。知られているように、_.templateには文字列を渡す方法とtext/templateセクションをセレクタで渡す方法があります。/></div></script>テンプレートセクションの記述はunderscore.jsの呼び出し元HTMLである必要があります。ところでサーバサイドのMVCフレームワークに慣れ親しんだ人はこれがちょっと違和感で、できればテンプレートを分離して別ファイルにしてviewsフォルダとかにまとめたい欲望に駆れたことはないでしょうか。御存知の通りクライアントサイドJavascriptは表示しているHTMLのDOMに対する操作を主に行うためのもので、別ディレクトリの要素については全く関与しません(当たり前)。デザイナーと分業したり、テンプレートセクションが増えすぎてソースが汚くなるのは嫌だから分離させたら何かと便利じゃない?、という人のために、viewsフォルダを分けて管理する方法について、敢えて考えてみたいと思います。テンプレートを格納するためのフォルダを作成します。フォルダはAJAXでJSからアクセスできる必要があり、今回は/viewsとします。underscore.jsの呼び出し元index.htmlviews/ここにテンプレートファイルを入れる次に指定されたファイル名でviewsフォルダからHTMLを取得する関数を作成します。名前は何でもいいので今回は_renderという名前にしました。2度めからのアクセスはキャッシュから参照させるため、tmpl_cacheというキャッシュ格納用変数も用意します。tmpl_cache[tmpl_name];}_renderは拡張子を省略したファイル名を渡すと、viewsディレクトリからHTMLを取得して文字列を返す関数です。一度呼び出したテンプレートはキャッシュ変数に保持して二回目のアクセスはAJAX通信が発生しないようにします。acyncをfalseにして強制的に同期処理させます。View側からは_.templateの第一引数に_renderを指定します。_.template(_render("item-template"),name)viewsにitem-template.htmlを作成します。/></div>_renderがAJAX通信して取得した結果を、HTMLとして_.templateに渡す感じになります。これで別ディレクトリに作成したテンプレートを_.templateに渡すことができるようになりました。この方法、テンプレート取得のたびに無駄なAJAX通信が発生するため、WEBサイトでやる意味はほとんどないと思います。PhoneGap+Backbone.jsでアプリを作る時などローカル限定での呼び出しに留めておくのが良いと思います。いうわけで、Backbone.jsほとんど関係ないエントリになってしまいましたが、以上よろしくお願い致します。月別アーカイブ参加グループプログラミングはてなブログをはじめよう!masahiko_of_joytoyさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。