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

标签 javascript html performance underscore.js

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

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

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

最佳答案

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

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

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

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

Using Templates

Using string concatenation

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

关于javascript - html 模板 vs 通过 js 推送代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20243314/

相关文章:

javascript - d3js 和弦图中的淡入和弦

javascript - 在加载之前将 HTML 文档作为字符串获取

android - 如何在 Intent ACTION_SEND 中将超链接传递到 Gmail?

algorithm - 快速整数坐标在以原点为中心、半径为 r 的圆内/沿圆

javascript jquery 子节点

javascript - TypeScript 定义外部类

javascript - 子菜单的垂直下拉菜单事件类

javascript - 单标签 DIV 的 document.getElementById 失败

javascript - domContentLoaded 时间在网页测试中意味着什么?

xml - 在 R 中获取 xml 属性花费的时间太长并且占用大量内存