Question

我一直在阅读jQuery模板插件http://api.jquery.com/tmpl/作为将数据绑定到标记的方法。所有示例似乎都表明您在脚本新脚本标记中定义模板。我实际上不希望我的html <head>与所有这些脚本标签混在一起。

有没有更好的方法来组织这个？也许有一个模板文件夹，里面装满了动态加载的脚本？

Answer 1

您可以将模板存储在外部文件中（例如，通过Ajax获取它们）。

来自http://api.jquery.com/jQuery.template/

“...对于远程模板，你可以使用你想要的任何AJAX调用将模板标记作为字符串，或者你可以简单地使用指向定义字符串的js文件的静态脚本块。然后你应该使用jQuery.template从字符串中编译模板，然后从那里开始，使用jQuery.tmpl进行渲染“

Answer 2

你不必这样做。您可以（例如）将模板保存在.js文件中（类似于消息目录）：

// this is a file full of templates
var SITE_TEMPLATES = {
  ERROR_1: 'This is an error template: the error is ${error.msg}',
  WHATEVER: 'I cannot make this stuff up but you get the ${idea}'
};

将其拉入，然后您可以通过

使用模板

$('#someplace').append($.tmpl(SITE_TEMPLATES.ERROR_1, { error: { msg: "hello world" }}));

换句话说，$.tmpl()允许您传递模板正文作为第一个参数，它可以来自任何地方。

或者，因为将长模板编写为Javascript字符串常量有点麻烦，所以可以在一个静态HTML文件中堆积一堆文本<script>标记。然后你就可以把它放到隐藏的<div>或其它东西中。这样你仍然可以获得缓存的优势，并且维护模板可能更容易。

当然，沿着这些方向，您可以将模板作为单独的文件单独维护，并根据任何打包方案在站点构建时将它们粘合在一起。

在没有大量额外脚本标记的情况下制作jquery tmpl

2 个答案: