5

現時点では、4 つのテンプレートを含む 1 つの HTML ページがあり、さらに多くのテンプレートが含まれます。テンプレートを別のファイルに入れて「インポート」することはできますか? それらを .js ファイルで定義できますか?

jQquery テンプレート プラグインを使用しています: http://api.jquery.com/category/plugins/templates/

私のコードは例のように見えます!

4

3 に答える 3

5

私はこの回答のスピンにほとんど同意します: HTMLテンプレートを保持する場所は? KISSの原則 により、あなたはすでに正しいことをしています。

最終的に作成するテンプレートの数 (「さらに多く」と述べました) に応じて、それらをメイン ページから分離することをお勧めします。これにはいくつかの理由があります。

理由の 1 つは、やはり KISS の原則です。テンプレートが多すぎると、ソース コードをナビゲートするのが難しくなる可能性があります。エディターまたは IDE では、これについて既に説明している場合があります。そうでない場合は、テンプレートを別のファイルに入れる良い理由になるかもしれません。

もう 1 つの理由は、パフォーマンスのためです。テンプレートを使用せずに HTML ファイルを単独で提供すると、ページがクライアントに到着し、はるかに早くレンダリングが開始されます。クライアントがいくつかのテンプレートをキャッシュし、変更されたときにのみ新しいテンプレートをロードすることを許可することもできます。これにより、サイトへの今後の訪問がはるかに高速に初期化されます。

パフォーマンスが特に重要な場合は、2 つのアプローチの組み合わせを検討してください。メインの HTML ページに、ページの基本構造を組み立てる重要なテンプレートを含めます。次に、オプションのテンプレートは、ページの読み込み後および/または必要になる直前に取得できます。必須のテンプレートを含めるには、サーバー側のテンプレートを使用できます。

あなたの最初の質問に関して、それらをどこに保管するかについては、あなたにとって意味のある場所に置くべきだと言います. 次に、テンプレートを作成してフェッチする方法については、jQuery テンプレートでの外部テンプレートの使用に関する Dave Ward の記事を参照してください。コードの重要なスニペットは次のとおりです。

// Asynchronously our PersonTemplate's content.
$.get('PersonTemplate.htm', function(template) {

  // Use that stringified template with $.tmpl() and 
  //  inject the rendered result into the body.
  $.tmpl(template, person).appendTo('body');
});

次に、Stephen Walther 著の「jQuery テンプレートの紹介」を参照して、「リモート テンプレート」というタイトルのセクションにジャンプしてください。彼は、テンプレートを一度だけフェッチしてコンパイルする例を持っていますが、複数回レンダリングすることを可能にします。重要なスニペットは次のとおりです。

// Get the remote template
$.get("ProductTemplate.htm", null, function (productTemplate) {

    // Compile and cache the template
    $.template("productTemplate", productTemplate);

    // Render the products
    renderProducts(0);
});

function renderProducts() {
    // Get page of products
    var pageOfProducts = products.slice(pageIndex * 5, pageIndex * 5 + 5);

    // Used cached productTemplate to render products
    $.tmpl("productTemplate", pageOfProducts).appendTo("#productContainer");
}
于 2011-09-02T17:19:26.543 に答える
2

このスタックオーバーフローの質問をチェックしてください。ここにはたくさんの例があります編集: JQueryの推奨JavaScript HTMLテンプレートライブラリが古い可能性がありますか?

また、外部テンプレート ファイルの使用に関する最近の記事: http://encosia.com/2010/10/05/using-external-templates-with-jquery-templates/

于 2011-01-18T06:50:29.927 に答える
0

.NETを使用していない場合に、これが役立つかどうかはわかりません。しかし、私は同じ問題を抱えており、それを行うためのコードをいくつか作成しました。

http://htmldeploy.codeplex.com/SourceControl/changeset/view/228d0905a46b#src%2fHtmlDeploy%2fJqueryTemplate.cs

これは基本的にパスに移動し、すべてのhtmlファイルをコピーして貼り付け、スクリプトtype = "text/x-jquery-tmpl"の部分を添付します。

これをさらに自動化する必要がある場合は、html/aspxファイルの本文にテンプレートを追加する他のコードを次に示します。

http://htmldeploy.codeplex.com/SourceControl/changeset/view/228d0905a46b#src%2fHtmlDeploy%2fMasterPage.cs

必要なHTTPリクエストの量が多いため、外部テンプレートメソッドは好きではありません。理想的には、ページに一度ダウンロードして、テンプレートを忘れることができます。Asp.netを使用している場合は、これをMasterPageに配置できます:)

お役に立てば幸いです

チー

于 2011-01-20T22:21:58.157 に答える