zoukankan      html  css  js  c++  java
  • javascript doT 使用

    • interpolation
      • 赋值
    • evaluation
      • 循环
    • partials
      • 子模板
    • conditionals
      • 条件 if-else
    • arrays
      • 数组遍历
    • encode

          

    详细使用示例:

    View Code
    <html>
    <head>
    
    <script id="headertmpl" type="text/x-dot-template">
    <h1>{{=it.title}}</h1>
    </script>
    
    <script id="pagetmpl" type="text/x-dot-template">
    <h2>Here is the page using a header template</h2>
    {{#def.header}}
    {{=it.name}}
    </script>
    
    <script id="customizableheadertmpl" type="text/x-dot-template">
    {{#def.header}}
    {{#def.mycustominjectionintoheader || ''}}
    </script>
    
    <script id="pagetmplwithcustomizableheader" type="text/x-dot-template">
    <h2>Here is the page with customized header template</h2>
    {{##def.mycustominjectionintoheader:
    <div>{{=it.title}} is not {{=it.name}}</div>
    #}}
    {{#def.customheader}}
    {{=it.name}}
    </script>
    
    <script src="../doT.min.js" type="text/javascript"></script>
    </head>
    
    <body>
    <div id="content"></div>
    <div id="contentcustom"></div>
    </body>
    
    <script type="text/javascript">
    var def = {
    header: document.getElementById('headertmpl').text,
    customheader: document.getElementById('customizableheadertmpl').text
    };
    var data = {
    title: "My title",
    name: "My name"
    };
    
    var pagefn = doT.template(document.getElementById('pagetmpl').text, undefined, def);
    document.getElementById('content').innerHTML = pagefn(data);
    
    pagefn = doT.template(document.getElementById('pagetmplwithcustomizableheader').text, undefined, def);
    document.getElementById('contentcustom').innerHTML = pagefn(data);
    
    </script>
    
    </html>
  • 相关阅读:
    Poj 1973 Software Company(二分+并行DP)
    Bellman-Ford算法及其队列优化(SPFA)
    Java程序打包成exe可执行文件
    zabbix监控入门初步
    网页解析器
    urllib2下载网页的三种方法
    ubuntu14.04允许root远程链接、修改主机名
    Iptalbes练习题(三)
    Iptalbes练习题(二)
    htop的使用
  • 原文地址:https://www.cnblogs.com/gaoxue/p/2935585.html
Copyright © 2011-2022 走看看