1

JavaScript テンプレート エンジンとしてjsrenderを使用しています。使用方法は非常に簡単です。

HTML ページで、テンプレート化された HTML コンテンツを含むスクリプト タグを定義します。

<script id="myTemplate" type="text/x-jsrender">
    <div>{{:name}} ({{:year}})</div>
</script>
...
<body>
<div id="content"></div>
</body>

JavaScript で、変数を定義し、テンプレートに対して render 関数を呼び出します。

var model = {
    name: "Findekano",
    year: 2012
};

$('#content').html($('#myTemplate').render(model));

質問は：

テンプレート定義をホスト HTML ページに保持したくありません。よりモジュール化できるように、JavaScript ファイルと一緒に別のファイルに保持したいと考えています。

私は以下のように何かをしたいと思います：

<script id="myTemplate" 
        type="text/x-jsrender" 
        src="template/myTemplate.html">
</script>

myTemplate.html は、必要な HTML テンプレート スニペットを定義します。上記のコードを試しましたが、うまくいきません。問題を解決する別の方法を提案できる人はいますか?

4

2 に答える 2

0

typeブラウザーは、(属性に基づいて) (内部的に) サポートしていない言語のスクリプトをダウンロードしません。

属性から URI を取得し、srcXHR でリソースを要求します。

于 2012-07-10T17:07:24.253 に答える
0

AJAX 呼び出しを使用する必要がなく、より多くのメモリを使用する必要がない場合は、考えられる代替ソリューションが少なくとも 1 つあります。AJAX の方がきれいかもしれませんが、とにかくこれを公開したいと思いました。

document.write('<script id="myTemplate" type="text/x-jsrender"><div>{{:name}} ({{:year}})</div></script>');

それを外部ファイルに入れてリンクする場合

<script type="text/javascript" 
    src="template/myTemplate.js">
</script>

次に、スクリプトは、jsrender が実際にアクセスできる DOM に、文字列の有効なスクリプト タグ コピーを追加します。もちろん、これはクライアントで約 2 倍のメモリを使用することになりますが、ファイルが大きすぎなければ問題にはなりません。

于 2012-07-10T17:03:11.973 に答える