良好的Javascript模板引擎與JSON一起工作

Question

我看了看jTemplates，值得一試。除了jTemplates之外，還有其他模板引擎嗎？

Answer 1

我喜歡的方式在JavaScriptMVC框架Views需要，特別是因爲它使用JavaScript本身作爲模板語言。該框架現在基於jQuery，您可以將您的Model權限渲染到視圖中（模型支持JSON，JSONP，XML等）。

Answer 2

它值得看看下面的鏈接。

http://wiki.github.com/nje/jquery/jquery-templates-proposal

Answer 3

Yajet是一個新的，發現一個語法不同於我們以前見過的任何語法。 :-)它編譯模板，它的速度非常快。它是瀏覽器和圖書館不可知的;對於不能沒有jQuery的人來說，有一個小的jQuery包裝器，但引擎本身是獨立的，並且可以在Rhino或V8中運行。

它支持多種指令，允許條件，循環，可重複使用的定義模板組件等

Answer 4

這裏jQuery中實現了Smarty的模板語言之一。 http://www.balupton.com/sandbox/jquery-smarty/demo/

一個令人印象深刻的功能是支持動態更新。因此，如果更新模板變量，它將更新模板中使用該變量的任何位置。相當漂亮。

您還可以使用onchange事件掛鉤變量更改。所以這對於說變音「頁面」變化時執行效果或AJAX很有用;-)

Answer 5

你試過pure.js？

與幾十種可用的JS模板引擎的主要區別在於PURE使HTML完全脫離JS邏輯。而且速度也非常快。

但是，它不是常見的<％...％>你可能喜歡的模板編程。
它具有一定的相似性與XSLT模式/聲明的方式（但沒有痛苦......）

Answer 6

其在2017年這個問題後，它看起來像JsRender和JsViews已成爲當前官方實現模板的jQuery的生態系統內（而不一定要求的jQuery）：

JsRender是一種重量輕，但功能強大的模板引擎，高度可擴展和高性能的渲染優化，而不依賴DOM。它設計用於瀏覽器或Node.js，無論有沒有jQuery。

JsRender和JsViews共同提供官方jQuery插件JQuery模板和JQuery數據鏈接的下一代實現 - 並取代這些庫。

- JsRender GitHub Readme

官方網站：http://www.jsviews.com/

的GitHub（JsRender）：https://github.com/BorisMoore/jsrender

的GitHub（JsViews）：https://github.com/BorisMoore/jsviews

Answer 7

嘗試異步JS-模板。它的速度很快，因爲它並行請求可以是異步的。

用maven加工。

Answer 8

您可以使用此一：https://jocapc.github.io/jquery-view-engine/

它結合JSON對象的屬性與由名稱，ID或類元素的空HTML模板和匹配性。

首先，你需要有普通的HTML模板在你的頁面：

<div id="template"> 
    <h1 id="Name"></h1> 
    <label>Description:</label> 
    <textarea name="Desc"></textarea> 
    <ul> 
     <li class="bind-Tags"></li> 
    </ul> 
</div> 

然後，你需要將放置在模板JS對象：

var data = { Name: "JOVN", 
    Desc: "The simplest view engine", 
    Tags: ["View engine", "JavaScript", "SPA"] 
} 

最後只需填寫的觀點數據對象：

$("div#template").view(data); 

結果是：

<div id="template"> 
    <h1 id="Name">JOVN</h1> 
    <label>Description:</label> 
    <textarea name="Desc">The simplest view engine</textarea> 
    <ul> 
     <li class="bind-Tags">View engine</li> 
     <li class="bind-Tags">JavaScript</li> 
     <li class="bind-Tags">SPA</li> 
    </ul> 
</div> 

查看引擎將填充模板中的單個字段或複製數組元素。