前端模板引擎语法

简介:

可以尝试选择自己喜欢的模板

<!--Mustache 的模板 -->
<script id="Mustache" type="text/tmpl">
<ul>
    {{#list}}
        <li>{{{index}}}. 用户: {{{user}}}/ 网站:{{{site}}}</li>
    {{/list}}
</ul>
</script>
 
<!-- doT 的模板 -->
<script id="doT" type="text/tmpl">
<ul>
    {{ for (var val, i = 0, l = it.list.length; i < l; i ++) { }}
        {{ val = it.list; }}
        <li>{{=val[i].index}}. 用户: {{=val[i].user}}/ 网站:{{=val[i].site}}</li>
    {{ } }}
</ul>
</script>
 
<!--juicer 的模板 -->
<script id="juicer" type="text/tmpl">
<ul>
    {@each list as val}
        <li>$${val.index}. 用户: $${val.user}/ 网站:$${val.site}</li>
    {@/each}
</ul>
</script>
 
<!-- artTemplate 的模板 -->
<script id="template" type="text/tmpl">
<ul>
    <% for (i = 0, l = list.length; i < l; i ++) { %>
        <li><%=list[i].index%>. 用户: <%=list[i].user%>/ 网站:<%=list[i].site%></li>
    <% } %>
</ul>
</script>
 
<!-- underscore 的模板 -->
<script id="underscoreTemplate" type="text/tmpl">
<ul>
    <% for (var i = 0, l = list.length; i < l; i ++) { %>
        <li><%=list[i].index%>. 用户: <%=list[i].user%>/ 网站:<%=list[i].site%></li>
    <% } %>
</ul>
</script>
 
<!-- Handlebars 的模板 -->
<script id="Handlebars" type="text/tmpl">
<ul>
    {{#list}}
        <li>{{{index}}}. 用户: {{{user}}}/ 网站:{{{site}}}</li>
    {{/list}}
</ul>

</script>

本文转自TBHacker博客园博客,原文链接:http://www.cnblogs.com/jiqing9006/p/5950247.html,如需转载请自行联系原作者

相关文章
|
6月前
|
测试技术
33 # 基本模板引擎
33 # 基本模板引擎
24 0
|
7月前
|
JavaScript 容器
【Vue源码解析】mustache模板引擎
【Vue源码解析】mustache模板引擎
34 0
|
9天前
|
前端开发 JavaScript Java
thmeleaf模板引擎使用总结
thmeleaf模板引擎使用总结
|
4月前
模板引擎基本语法
模板引擎基本语法
|
5月前
|
前端开发 JavaScript Java
前端最常用的模板引擎-Handlebars
前端最常用的模板引擎-Handlebars
52 0
|
9月前
|
JavaScript 前端开发
vue源码解析之mustache模板引擎
vue源码解析之mustache模板引擎
61 0
|
Java 应用服务中间件
详解模板引擎二
详解模板引擎二
74 0
详解模板引擎二
ThinkPHP6.0使用twig作为模板引擎及自定义过滤器
ThinkPHP6.0使用twig作为模板引擎及自定义过滤器
133 0
|
开发框架 自然语言处理 安全
第21天:Web开发 Jinja2模板引擎
第21天:Web开发 Jinja2模板引擎
178 0
第21天:Web开发 Jinja2模板引擎
|
Web App开发 JavaScript 前端开发