jquery – 在页面上存储HTML模板的最佳做法?

前端之家收集整理的这篇文章主要介绍了jquery – 在页面上存储HTML模板的最佳做法?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在建立一个相当沉重的JavaScript界面​​,我决定使用(最近制作的官方) jQuery templates plugin生成从我的查询到JSON API的元素。现在,我目前遇到的问题是:

我很容易有一堆这些模板。一种用于各种对象,一些用于列表,一些用于页面的部分等。是否有任何首选的存储这些模板的方法?我已经阅读了关于定义< script>使用模板名称使用id的标签,然后从那里检索文本(如“John001”在“JavaScript Micro-Templating”中所描述的那样),但是包含一些< script>每个页面中的标签看起来有点黑客。

那么问题是:这种场景有什么“最佳实践”吗?

解决方法

为什么不将模板加载到隐藏的元素中,然后使用$(template).clone()?这样可以节省大量的头痛。我不能与.clone()和< script>方法,但我可以告诉你,额外的脚本标签性能损失,只是一般使代码泥泞。

为什么?

>即使你有一个诡异的逃脱实用工具,仍然会犯错误,而且他们会更难读懂。另外,如果你必须在一个团队的情况下工作,特别是如果人们滚动/滚动项目,这可能不容易理解。
>你可以创建一个指针对象,例如templates = {},并使用jquery对象指针加载到您的可克隆元素,如下所示:

templates = {};
 templates.message = $("#templates .message");
 templates.dialog = $("#templates .dialog");

现在你必须做的是创建一个新的模板是:

var newDialog = templates.dialog.clone();

你可以做一个包装函数来接受params,然后用newDialog.find(“title”)。html(title),newDialog.find(“message”).html(message)等添加它们。

再次,从性能的角度来看,我不知道哪一个更快,因为我现在没有时间测试。但是我知道使用制裁的方法通常更好,当一个足够大的代码库需要模板时,其他人将不可避免地需要最终的参与,而你必须要做的更多的是解释事情,你拥有的时间越少做自己的badass编码。

性能的另一个重要方面是时序…如果您遇到性能延迟,您应该确保使用setTimeout分解冗长的可执行代码块。它创建一个新的堆栈,让浏览器绘制已经处理的内容,直到创建新堆栈之前。在处理视频延迟时,这是非常有用的,这是性能问题的一部分(通常是最常见的性能问题,特别是非编程人员)。如果你想要一些更多的信息,给我一个消息,我会收集一些资源。现在有限的时间,在工作中扑灭火灾。 原文链接:https://www.f2er.com/jquery/183268.html

猜你在找的jQuery相关文章