javascript - 使用 JavaScript 的模板字符串

Question

我正在编写一个带有一些客户端 JS 的应用程序，我经常使用它来更新 DOM。

事情是做这样的事情:

$('#id').html('<div class="' + class + '">' + content + '</div>');

多次将 HTML 随机放置在您的 JavaScript 周围不是很漂亮且难以维护。

Lithium 在其 View 助手中处理此问题的方式是否有 JavaScript 等效(或替代解决方案)。

参见:

• http://li3.me/docs/lithium/template/Helper::_render()
• http://li3.me/docs/lithium/util/String::insert()

例如。

基本上在 PHP 版本中，您会创建一个关联的常用字符串数组和一个简单的替换方法，以用同名变量替换这些字符串的某些标记部分。

另一个愚蠢的例子(伪代码:)

var strings = {
    'div': '<div {:attr}>{:content}</div>'
};
console.log(render('div', {id: 'newElem'}, 'Hello, World!'));
// Output: <div id="newElem">Hello, World!</div>

如果您对如何处理在 JavaScript 中存储 HTML 并防止它到处乱跑有任何更好的建议，那么我非常想听听。

Answer 1

是的，使用 jQuery templates或 Underscore templates (我最喜欢的) 或任何其他 JS templating engine在那里。

另外，检查这个问题以获得关于模板引擎性能的讨论:Improve jQuery template performance