如何使用John Resig JavaScript Micro-Templating引擎？

我已經搜索了谷歌上使用John Resig JavaScript Micro-Templating引擎的一個基本例子，但是出來幹了。如何使用John Resig JavaScript Micro-Templating引擎？

我決定把它帶給基礎傢伙。任何人都可以使用這個引擎的簡單例子嗎？我以前從未使用過客戶端模板引擎。

更新：這是完整的HTML文檔。感謝Will。

<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 2009-11-21 10:06:53

如果你能提供一個小提琴的鏈接，那將會很好。 – ayjay 2015-09-20 15:44:28

您提供的鏈接在引擎代碼之後立即有一個示例。從第二段中讀取下來。

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 2009-11-25 01:41:25

如何使用John Resig JavaScript Micro-Templating引擎？

回答

相關問題