zoukankan      html  css  js  c++  java
  • JavaScript-Templates

    https://github.com/blueimp/JavaScript-Templates

    https://blueimp.github.io/JavaScript-Templates/

    https://github.com/blueimp/JavaScript-Templates/blob/master/README.md

    template

    <h3>{%=o.title%}</h3>
    <p>Released under the
    <a href="{%=o.license.url%}">{%=o.license.name%}</a>.</p>
    <h4>Features</h4>
    <ul>
    {% for (var i=0; i<o.features.length; i++) { %}
        <li>{%=o.features[i]%}</li>
    {% } %}
    </ul>

    data

    {
    "title": "JavaScript Templates",
    "license": {
    "name": "MIT license",
    "url": "https://opensource.org/licenses/MIT"
    },
    "features": [
    "lightweight & fast",
    "powerful",
    "zero dependencies"
    ]
    }

    显示

    Render the result by calling the tmpl() method with the id of the template and the data object as arguments:

    document.getElementById("result").innerHTML = tmpl("tmpl-demo", data);

    Templates syntax

    Interpolation

    Print variable with HTML special characters escaped:

    <h3>{%=o.title%}</h3>

    Print variable without escaping:

    <h3>{%#o.user_id%}</h3>

    Print output of function calls:

    <a href="{%=encodeURI(o.url)%}">Website</a>

    Use dot notation to print nested properties:

    <strong>{%=o.author.name%}</strong>

     

    Evaluation

    Use print(str) to add escaped content to the output:

    <span>Year: {% var d=new Date(); print(d.getFullYear()); %}</span>

    Use print(str, true) to add unescaped content to the output:

    <span>{% print("Fast &amp; powerful", true); %}</span>

    Use include(str, obj) to include content from a different template:

    <div>
    {% include('tmpl-link', {name: "Website", url: "https://example.org"}); %}
    </div>

    If else condition:

    {% if (o.author.url) { %}
        <a href="{%=encodeURI(o.author.url)%}">{%=o.author.name%}</a>
    {% } else { %}
        <em>No author url.</em>
    {% } %}

    For loop:

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

    文件结构分析

    有3个Function in Dart,分别是load,func,encode

    另外有6个字段

  • 相关阅读:
    团队冲刺第二阶段-7
    用户体验评价
    团队冲刺第二阶段-6
    第十四周学习进度报告
    团队冲刺第二阶段-5
    团队冲刺第二阶段-4
    14周课堂测试---找水王
    进度日报14
    进度日报13
    进度日报12
  • 原文地址:https://www.cnblogs.com/chucklu/p/11088387.html
Copyright © 2011-2022 走看看