使用text.js与require.js我如何创建一个模板html文件,但单独抓取每个脚本模板

Using text.js with require.js how can I create one template html file but grab each script template individually?

本文关键字:js 文件 html 脚本 抓取 单独 require text 何创建 使用 创建      更新时间:2023-09-26

我正在使用require.js和text.js加载一个模板文件,其中有一堆<script>模板:

。/脚本/模板/comments.html

<script type="text/template" id="js-comment-reply-tmpl">
// html in here
</script>
<script type="text/template" id="js-comment-edit-tmpl">
// html in here
</script>
因为使用下划线的模板系统(或任何类似的js微模板系统),这个文件本身被加载为一个字符串。是否有一种聪明的方法可以从该文件中抓取每个模板?例如,$(template).html()在jQuery中包装它,然后做一个find()或什么?我必须首先将其放入DOM中,所以这可能会慢得要命,我甚至可以不使用text.js加载它,只是将其从DOM中取出。

我的另一个想法是将它们每个拆分为自己的文件,但这样会减慢请求时间(尽管我可能最终会使用带有node的rjs来最小化这一切,所以这无关紧要)。

。/脚本/模板/comment_reply.html

<script type="text/template" id="js-comment-reply-tmpl">
// html in here
</script>

。//模板/comment_edit.html的脚本//HTML在这里

做这件事最好/最有效的方法是什么?

我建议将每个模板移动到它自己的文件中,并分别加载它们。这样做的一些好处是:

  • 更容易维护 -在项目中搜索模板更容易,如果他们都有自己的名字,它也减少了源代码控制冲突的麻烦,如果开发人员不都编辑相同的文件。

  • 可移植性 -如果你最终使用一个可以在服务器上使用的模板系统(如Mustache),那么模板已经很容易在前端和后端之间共享。

您已经强调的主要缺点是额外的请求,但您绝对不应该在没有使用r.js构建脚本的情况下进行生产,所以这应该不是问题