zoukankan      html  css  js  c++  java
  • doT.js-doT模板方便快捷的组织页面DOM

    重来没有想过,作为一个坐吃等死的前端也会有学习引擎模板的一天

    都是被现实所逼呀.学习优秀代码时,一句一句翻译。忽然看到{{   }}这个包裹的代码。糟心了!看不懂,咋办?学呀!!!!!!

    这是我开始学习的第一个引擎模板!!!鼓掌

    doT.js

    插件描述:doT模板方便快捷的组织页面DOM

    doT.js特点是快,小,无依赖其他插件

    当然了,网上有很多同僚都有介绍这个模板的,基本全部一样。所以我也不会有所改动(照搬)

    1.基本使用套路百度翻译:(真心的,这个百度翻译后的中文我自己都不明白)

    {{    }}for evaluation(百度翻译:为了评价)

    {{=    }}for interpolation(百度翻译:插值法)   //理解为:赋值

    {{~    }}for array iteration(百度翻译:数组代)

    {{?     }}for conditionals(百度翻译:条件句)

    {{!   }}for interpolation with encoding(百度翻译:用编码进行插值)

    {{#    }}for compile-time evaluation/includes and partials(百度翻译:编译时的评估/包含和部分)

    {{##  #}}for compile-time defines(百度翻译:编译时间定义)

    2.举例

    首先是要引用插件的

    <script type="text/javascript" src="jquery-1.11.3.js" ></script>
    <script type="text/javascript" src="doT.js" ></script>

    1).for interpolation 赋值

    格式:

    {{=    }}

    <div id="interpolation"></div>

    <script id="interpolationtmpl1" type="text/x-dot-template">
           <div>Hi {{=it.name}}!</div>
           <div>{{=it.age || ''}}</div>
    </script>

    <script>

         var dataInter1 = {
               "name": "Jake",
               "age": 31
         };
          var interText1 = doT.template($("#interpolationtmpl1").text());
           $("#interpolation").html(interText1(dataInter1));
    </script>

     
  • 相关阅读:
    metadata的使用以及简单的orm模式
    python的cache修饰器
    聊天服务的设计随想
    cherrypy入门
    用python做分布式定时器
    cherrypy & gevent patch
    Python Tornado简单的http request
    连接池的一些感悟
    企业系统架构评估标准
    Nginx与python web服务配置(Uwsgi& FastCGI)
  • 原文地址:https://www.cnblogs.com/liuqingxia/p/8994609.html
Copyright © 2011-2022 走看看