John Resig JavaScript Micro-Templatingエンジンの使い方は？

GoogleでJohn Resig JavaScript Micro-Templatingエンジンを使用した場合の基本的な例を少し検索しましたが、乾燥してしまいました。John Resig JavaScript Micro-Templatingエンジンの使い方は？

私はそれをベースの人に持ち込むことに決めました。誰もこのエンジンを使用する簡単な例を手伝ってもらえますか？私はこれまでクライアント側のテンプレートエンジンを使ったことがありません。

更新：これは完全なHTMLドキュメントです。ウィルに感謝します。

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>John Resig JavaScript Micro-Templating engine</title> 
    <script src="jquery-1.3.2.js" type="text/javascript"></script> 
    <script src="MicroTemplates.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     //Data 
     var data = { fname: "fred" }; 

     function onloadFunction() { 
      var s = $("#biodata").html(); 
      var s1 = tmpl(s, data); 

      $("#target").html(s1); 
     } 
    </script> 
    <script id="biodata" type="text/html"> 
     <div><%= fname %></div> 
    </script> 
</head> 
<body onload="onloadFunction();"> 
    <div id="target"> 
    </div> 
</body> 
</html>

出典

2009-11-21 Tebo

ありがとうございました。グレッグ – Tebo

フィドルへのリンクを提供できればいいと思います。 – ayjay

あなたが提供したリンクには、エンジンコードの直後の例があります。第2段落から読んでください。

CBは、ここではdivタグ間のfnameの値を出力するエンジンを取ります。世代を実行するには、次のような何かをするでしょう：

var data = { fname : "fred" }; 
var generatedText = tmpl("biodata", data);

次に、出力する必要があります。

document.write(generatedText);

又は（DIVを仮定すると、 'elemId' のIDとページ内に存在する）

var elem = document.getElementById("elemId"); 
elem.innerHTML = generatedText;

上記のすべてがテストされていないが、うまくいけば、正確です。それが役に立てば幸い！

出典

2009-11-21 10:10:49 Will

優秀な、私の最初に受け入れられた答え！助けてくれてうれしい！ =） – Will

John Resig JavaScript Micro-Templatingエンジンの使い方は？

答えて

関連する問題