Question

模板在已有的编程语言中是一项相当健康的业务，但有哪些好的可以在JavaScript中处理？

“模板”是指接受数据对象作为输入的文档，将数据插入某种序列化标记语言，并输出标记。众所周知的例子是JSP，最初的PHP，XSLT。

“好”的意思是说HTML作者写作是声明性的，容易编写，它很健壮，而且它也支持其他语言。比我所了解的选项更好。一些“不好”的例子：

字符串数学：

element.innerHTML = "<p>Name: " + data.name
    + "</p><p>Email: " + data.email + "</p>";

显然太笨重，HTML结构不明显。

XSLT：

<p><xsl:text>Name: </xsl:text><xsl:value-of select="//data/name"></p>
<p><xsl:text>Email: </xsl:text><xsl:value-of select="//data/email"></p>

//从结构上说这很有效，但让我们面对它，XSLT会混淆HTML开发人员。

Trimpath：

<p>Name: ${data.name}</p><p>Email: ${data.email}</p>

//这很好，但处理器仅在JavaScript中受支持，并且该语言有点原始（http://code.google.com/p/trimpath/wiki/JavaScriptTemplateSyntax）。

我很想看到JSP或ASP或PHP的一个子集移植到浏览器，但我还没有找到。

人们在JavaScript中使用这些天来进行模板化的是什么？

附录

几个月后，这里发布了大量可行的模板语言，但大多数语言都不能用于任何其他语言。大多数这些模板都无法在JavaScript引擎之外使用。

例外是微软 - 您可以在浏览器或任何其他ASP引擎中处理相同的ASP。由于您已经绑定到Microsoft系统，因此它有自己的一组可移植性问题。我已经将其标记为答案，但我仍然对更便携的解决方案感兴趣。

感谢目前为止的所有输入！

Answer 1

John Resig在http://ejohn.org/blog/javascript-micro-templating/

有一个迷你javascript模板引擎

Answer 2

您可能需要查看Mustache - 这是一种非常便携且简单的模板语言，其他语言支持javascript。

Answer 3

我今天遇到过这个问题，但我还没试过......

http://beebole.com/pure/

Answer 4

Closure templates是来自Google的相当强大的模板系统，它们适用于Javascript和Java。我有很好的使用经验。

Answer 5

ExtJS有一个名为Ext.XTemplate的特殊模板类：http://extjs.com/deploy/dev/docs/?class=Ext.XTemplate

Answer 6

我使用Google Closure个模板。 http://code.google.com/closure/templates/docs/helloworld_js.html

简单模板，BiDi支持，自动转义，针对速度进行优化。此外，模板解析作为构建步骤发生，因此它不会减慢客户端的速度。另一个好处是，您可以使用Java中的相同模板，以防您需要在服务器上为禁用JavaScript的用户生成HTML。

Answer 7

天神http://www.kuwata-lab.com/tenjin/你可能正在寻找什么。没用过，但看起来不错。

Answer 8

我写了http://google-caja.googlecode.com/svn/changes/mikesamuel/string-interpolation-29-Jan-2008/trunk/src/js/com/google/caja/interp/index.html，它描述了一个模板系统，它通过根据前面的上下文选择正确的转义方案，以防止XSS攻击的方式将字符串插值固定到javascript上。

Answer 9

即将推出的ASP.NET AJAX 4.0还有客户端模板功能。

http://encosia.com/2008/07/23/sneak-peak-aspnet-ajax-4-client-side-templating/

此外，您可以单独使用Microsoft AJAX Library（ASP.NET AJAX的JavaScript部分），而无需使用ASP.NET。

http://www.asp.net/ajax/downloads/

Answer 10

我很高兴using jTemplates：

http://jtemplates.tpython.com/

Answer 11

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

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

您还可以使用onchange事件挂钩变量。因此，当变量“page”改变时，执行效果或AJAX会很有用; - ）

Answer 12

QueryTemplates 演示：http://sandbox.meta20.net/querytemplates-js/demo.html

Answer 13

如果您使用Script#，可能需要考虑SharpTemplate，这是一种强类型，超高效的HTML模板引擎。

Answer 14

如果您使用Rhino（JavaScript的Java实现），您也可以在服务器上运行您选择的JavaScript模板语言。

您还确定服务器和浏览器模板结果完全相同。（如果模板以2种语言实现，则实现之间可能存在一些细微差别。）

...但现在5年后（也就是2016年），使用Java 8，你将使用Nashorn而不是Rhino。这是Nashorn的介绍，如果你向下滚动一下，你会发现一个Nashorn + Mustahce模板语言的例子： http://www.oracle.com/technetwork/articles/java/jf14-nashorn-2126515.html

（我个人使用React.js服务器端，通过Nashorn（但React不是模板语言）。）

Answer 15

远程模板http://code.google.com/p/distal 有点像你的XSLT演示，但更简单：

<p>Name: <span data-qtext="data.name"></span></p>
<p>Email: <span data-qtext="data.email"></span></p>

Answer 16

一个可能有趣的选择是https://github.com/rexxars/react-markdown，这是一种在基于React的Web UI中包含markdown的有趣方式。我已经对它进行了测试，效果相当不错，尽管文档让我明白HTML渲染已经在3.x分支中获得了一些问题。不过，对于某些用途来说，它似乎是一个可行的选择。

JavaScript支持哪种好的模板语言？

附录

16 个答案: