Javascript html模板与通过js推送代码

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

---

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

• 话虽如此，在您的案例中使用模板（下划线），代码 这比生成长HTML更容易管理 通过将各种值连接在一起来创建字符串

• 此外，带有条件语句的已编译模板可以存储在变量中，并通过对模板进行单个调用（并向其传递对象）进行重用。然而，如果您需要填充HTML字符串，那么在这种情况下，您将在

  for

  循环或其函数编程等价物

  $中编写字符串连接语句，以使其可重用
  

这里有两个小提琴，它们基本上使用上述两种方法做相同的事情：

---

比较代码，自己决定什么最适合你的需求。

我会在

script

标签中使用一个不可见的

div

而不是html代码，这样谷歌就可以对它进行索引

---

我还将使用

.clone（）

方法克隆DOM结构，而不是检索纯文本html（

.html（）

）并基于此创建新元素。但是更改模板中的值可能会有点棘手-但可能会更快；还没有测试。

我非常喜欢模板制作。它让我有机会在我期望的地方编辑我的html，但浏览器在html内容中保存模板。如果我可以通过js来推送它，它可以只是一个字符串/字符串数组。我在想，这是昂贵的！你的例子并不相同。第一个模板允许在运行时替换新值，第二个模板只是一个不透明字符串。我怀疑性能差异是否值得担心，特别是如果你是明智的，并且缓存

.template

返回的函数，这样你只需要构建它们一次。@CaptainCarl确实提出了一个很好的观点。它还可以避免重复键入.html（“内容”），因为它将位于一个集中的位置。无论性能如何，使用模板都是有原因的

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

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