Javascript中的HTML模板？没有在页面编码？

Question

我是一个网络人,主要做Perl服务器端的东西,我正在慢慢得出一些结论.

• 通过Javascript完成大部分代码并通过AJAX来回丢弃数据要比提交和重新加载大致相同的页面要好得多
• 我喜欢jQuery,因为我喜欢CSS,把很长很长的和可怕的定义结合在一起很有趣
• 有一些模板的东西.

您希望HTML元素看起来像HTML元素,并且在HTML中定义它更容易:

<div class="sidebar_elem">
     <a href=""> TEXT</a>
</div>

比在Javascript或jQuery中拼凑相同:

( '<div/>' )
     .attr('id' , 'sidebar_elem' + i )
     .addclass( 'sidebar_elem' )
     ;
( '<a/>' )
     .attr('href' , link_url )
     .appendTo( '#sidebar_elem' + i )
     ;

这就是说我不再是模板不可知论者,但我不知道相信哪种模板工具.我已经研究了一些基于jQuery的模板插件,但我还没有对它们中的任何一个感到满意,部分是因为我所看到的似乎想要将所有代码放入页面本身,这打破了"只有标记进入HTML文件,只有样式进入CSS文件,只有代码进入JS文件"咒语我一直在背诵.

所以,我正在寻找一个基于Javascript的模板工具,它允许我将模板放在外部文件中,这样我就可以在一系列网页上进行一次模板更改.如果它是基于jQuery的,那很好,我需要学习的东西少,但它不是一个交易破坏者.

Answer 1

EJS怎么样？

他们页面的示例：

“EJS 结合数据和模板来生成 HTML。”

数据：

{title: 'Cleaning Supplies',  supplies: ['mop', 'broom', 'duster'] }

模板：

<ul>
<% for(var i=0; i<supplies.length; i++) {%>
   <li><%= supplies[i] %></li>
<% } %>
</ul>

结果：

• 拖把
• 扫帚
• 掸子