良好的 Javascript 模板引擎，可与 JSON 一起使用答案

【问题标题】：Good Javascript template engine to work with JSON良好的 Javascript 模板引擎，可与 JSON 一起使用
【发布时间】：2011-02-25 03:01:14
【问题描述】：

我看过jTemplates，值得一试。除了 jTemplates 还有其他模板引擎吗？

【问题讨论】：

PS：正常语句以一个点结尾，问题以问号结尾。我现在已经为你修好了，但你应该在以后的问题中尽量注意这一点。否则很少有人会认真对待您的问题；）

标签： javascript template-engine

【解决方案1】：

你试过pure.js吗？

与数十种可用的 JS 模板引擎的主要区别在于 PURE 将 HTML 与 JS 逻辑完全分离。而且速度也很快。

但是，它不是您可能喜欢的常见的类型的模板编程。
它有一种模式/声明性方法，与 XSLT 有一些相似之处（但没有痛苦......）

【讨论】：

【解决方案2】：

我喜欢 JavaScriptMVC Frameworks Views 采用的方法，特别是因为它使用 JavaScript 本身作为模板语言。该框架现在基于 jQuery，您可以将 Model 直接渲染到视图中（模型支持 JSON、JSONP、XML 等）。

【讨论】：

【解决方案3】：

这是一个用 jQuery 实现的 Smarty 模板语言。 http://www.balupton.com/sandbox/jquery-smarty/demo/

一个令人印象深刻的功能是支持动态更新。因此，如果您更新模板变量，它将更新模板中使用该变量的任何位置。很漂亮。

您还可以使用 onchange 事件挂钩变量更改。因此，当说变量“页面”发生变化时，这对于说执行效果或 AJAX 很有用;-)

【讨论】：

【解决方案4】：

你可以用这个：https://jocapc.github.io/jquery-view-engine/

它将 JSON 对象的属性绑定到空的 HTML 模板中，并按名称、id 或类将属性与元素匹配。

首先，您的页面中需要有纯 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>

视图引擎将填充单个字段或复制模板中的数组元素。

【讨论】：

【解决方案5】：

Yajet 是一个新的语法，它发现了一种与我们以前见过的语法不同的语法。 :-) 它编译模板并且速度非常快。它与浏览器和库无关；有一个小的 jQuery 包装器供那些离不开 jQuery 的人使用，但引擎本身是独立的，也可以在 Rhino 或 V8 中运行。

它支持许多允许条件、循环、定义可重用模板组件等的指令。

【讨论】：

这个链接是一些日本网站，我想这个项目已经被取消了。

【解决方案6】：

在 2017 年有这个问题之后，看起来 JsRender 和 JsViews 已经成为 jQuery 生态系统中当前官方模板的实现（虽然不一定需要 jQuery）：

JsRender 是一个轻量级但功能强大的模板引擎，具有高度可扩展性，并针对高性能渲染进行了优化，不依赖于 DOM。它专为在浏览器或 Node.js 上使用而设计，无论有无 jQuery。

JsRender 和 JsViews 共同提供了官方 jQuery 插件 JQuery Templates 和 JQuery Data Link 的下一代实现——并取代了这些库。

- JsRender GitHub Readme

官网：http://www.jsviews.com/

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

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

【讨论】：

【解决方案7】：

试试 async-js-templates。它的速度很快，因为它执行可以异步的并行请求。

它是随 maven 一起提供的。

【讨论】：

【解决方案8】：

下面的链接值得一看。

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

【讨论】：