如何将html页面上的形状存储,在页面上存储HTML模板的最佳实践？

Jessica Jaco..

8

为什么不将模板加载到隐藏元素中然后使用$(template).clone()？这节省了许多逃避的头痛.我不能谈论.clone()与

为什么？

即使你有一个时髦的逃避实用程序,仍然会犯错误,并且它们将更难以阅读.此外,如果您必须在团队工作中工作,特别是如果人们启动/滚动项目,可能不容易理解.

你可以创建一个指针对象,templates = {}然后使用jquery对象指针将其加载到可克隆的元素,如下所示:

templates = {};

templates.message = $("#templates .message");

templates.dialog = $("#templates .dialog");

现在,您只需要创建一个新模板:

var newDialog = templates.dialog.clone();

您可以创建一个包装函数来接受参数,然后添加newDialog.find("title").html(title), newDialog.find("message").html(message),等等.

同样,从性能的角度来看,我不知道哪个更快,因为我现在没有时间进行测试.但是我知道在使用足够大的代码库来处理需要模板时,使用认可的方法通常会更好......最终其他人不可避免地会参与其中,你需要解决的事情越多,你拥有的时间就越少做你自己的badass编码.

性能的另一个重要方面是时间...如果遇到性能延迟,则应确保使用setTimeout分解冗长的可执行代码块.它创建一个新的堆栈,让浏览器在创建新堆栈之前绘制已处理的内容.在处理性能问题(通常是最常见的性能问题,尤其是非编码人员)时,这极大地有助于处理视觉延迟.如果您想了解更多信息,请给我发消息,我会收集一些资源.现在时间有限,在工作中扑灭火灾.:)

模板的目的是轻松地将数据插入其中.克隆DocumentFragment会使这个过程非常痛苦.我可以在一行代码中从模板生成html. (2认同)