javascript - html 模板 vs 通过 js 推送代码

Question

假设我想动态呈现一些 html。哪个更好？(除了它为代码提供了良好的结构)

<script type="text/template" id="some">
//some html code here
</script>
_.template($("#someid").html());

或

$("#someid").html("inserting html here");

Answer 1

在您提到的两种方法中，HTML 标记都生成为 HTML 字符串，然后添加到目标 DOM 元素。因此，在我看来，使用其中一种并没有性能优势。

• 话虽如此，在您的案例中使用模板(下划线)，代码只是变得比必须生成长 HTML 更易于管理通过将各种值连接在一起的字符串。

• 此外，带有条件语句的已编译模板可以存储在一个变量中，并通过对模板进行一次调用(并将对象传递给它)来重复使用。然而，如果您需要填充 HTML 字符串，那么在这种情况下，您最终将在 for 循环或其等效的函数式编程 $.each 或_.each 使其可重用。

这里有 2 个 fiddle ，它们基本上使用上述 2 种方法做同样的事情:

Using Templates

Using string concatenation

比较代码并自行决定最适合您的要求。