前端模板, 比连接字符串好用多了, 还可以使用循环\判断等语句, 减少工作量

<script type="text/template" id="member-tmpl">
<% var addHeader = true;
_.each(members, function(member) {
if ( Modernizr.mq( "only all and (max-width: 640px)" ) ) {
addHeader = true;
}
%>
<div class="row member">
<div class="col"><% if ( addHeader ) { %><div class="head">Id</div><% } %><div class="data"><%=member.id%></div></div>
<div class="col"><% if ( addHeader ) { %><div class="head">REST URL</div><% } %><div class="data"><a href="rest/members/<%=member.id%>" rel="external" target="_blank" class="resturl ui-link">JSON</a></div></div>
</div>
<% addHeader = false;
}); %>
</script>
  1. <% %>在这里不是jsp的标签,像jsp,php,asp都有这种写法,但在这里是采用那套javascript模版引擎的写法。

  2. javascript模版引擎,比如artTemplate,这个写在<% %>里面的代码的目的是替代js变量,预编译javascript,达到快速渲染的作用.

  3. 有空了解下这种javascript模版引擎的用法和原理

前端模板<script type="text/template" id="tmpl">的更多相关文章

  1. 关于 <script type='text/template' > 的妙用 / 使用jquery获取iframe加载完成事件

    https://www.cnblogs.com/ddqyc/p/6200539.html <!DOCTYPE html> <html> <head> <met ...

  2. Js script type="text/template"的使用简单说明

    <script type="text/template" id="treeTableTpl"> <tr id="{{row.id}} ...

  3. <script type="text/template">是干什么的,为什么要把html写在js中? 这是什么编程语言风格,都能这样用吗?

    这一段存放了一个模板.在js里面,经常需要使用js往页面中插入html内容.比如这样: var number = 123; $('#d').append('<div class="t& ...

  4. <script type="text/x-template"> 模板

    获取动态的js模板可以用art-template插件 <script type="text/template"> 给<script>设置type=" ...

  5. 关于MVC模板渲染的一点小事type="text/template"

    先上一个demo,简单粗暴,请自便 <!DOCTYPE html> <html> <head lang="en"> <meta chars ...

  6. <script type="text/html"></script> js模版使用

    <div></div> <script type="text/html" id="javascript_template"> ...

  7. script标签中type为<script type="text/x-template">是个啥

    写过一点前端的都会碰到需要使用JS字符串拼接HTML元素然后append到页面DOM树上的情况,一般的写法都是使用+号以字符串的形式拼接,如果是短点的还好,如果很长很长的话就会拼接到令人崩溃了. 比如 ...

  8. JavaScript type="text/template"的用法

    JavaScript type="text/template"相当于定义一个模板,如果没有使用html()方法的话,是显示不出来的,我们直接看例子(我是在tp框架的里面写的) &l ...

  9. document.write('<script type=\"text/javascript\"><\/script>')

    document.write('<script type=\"text/javascript\"><\/script>')

随机推荐

  1. java基础讲解12-----Swing

    package com.swing; import java.awt.*; import javax.swing.*; public class Swing01  extends JFrame{ /* ...

  2. ajax 参数data问题 data中的 参数名 参数值为string 提交到后台后,会自动转换参数名相同的 类型 和 js字符串拼接

    latlng"14.6005238,100.43635419999998"Cusid"accb5c1b-6aef-4f3b-a4eb-d60ea1ca5f54" ...

  3. FreeSWITCH技巧:如何向通话的另一方号码发送dtmf?

    注:这里的文章都是本人的日常总结,请尊重下个人的劳动成果,转载的童鞋请注明出处,谢谢. 如您转载的文章发生格式错乱等问题而影响阅读,可与本人联系,无偿提供本文的markdown源代码. 联系邮箱:ji ...

  4. Sql學習資源

    http://blog.csdn.net/wltica/article/category/1324738/1 SQL Server 整体方案系列: 1. SQL Server 数据归档方案 2. SQ ...

  5. bashrc,bash_profile和/etc/profile

    bashrc,bash_profile和/etc/profile 最近老出现在shell里面能跑的程序用鼠标双击app去不能跑.究其原因是因为环境变量的问题. 在类unix系统中一般有三个bash配置 ...

  6. [elk]kibana搜索绘图

    kibana绘图 好些日志入库了需要分析. 1,首先分析top10 url的table和柱状分布 2,其次想着分析下404所占比例,以及404所对应的url table. 3,最后分析一下请求总数. ...

  7. cacheManager载入问题

    net.sf.ehcache.CacheException: Another unnamed CacheManager already exists in the same VM. Please pr ...

  8. 第一篇:初识python

    1.python介绍 Python, 是一种面向对象的解释型计算机程序设计语言,由荷兰人Guido van Rossum于1989年发明,第一个公开发行版发行于1991年. Python的官方介绍是: ...

  9. 微信小程序3 - 对象的合并

    ES6中 Object.assign方法用于对象的合并,将源对象( source )的所有可枚举属性,复制到目标对象( target ). 限制:   只是浅拷贝, 即 内部对象 不会拷贝,只是 引用 ...

  10. linux—安装定时插件crontab

    安装crontab [root@iZ25j0kywimZ ~]# yum install -y vixie-cron Loaded plugins: security base | 3.7 kB 00 ...