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个字段

JavaScript-Templates的更多相关文章

  1. [CSSinJS] Convert Sass (SCSS) Styled Button to CSSinJS with JavaScript Templates and Variables

    This is an introduction to CSSinJS that doesn't require any JavaScript knowledge, just a basic CSS. ...

  2. 全新ASP框架——IISNODE介绍

    Asp是一门经典的动态网页编程语言,通常使用vbscript或者Jscript脚本来实现.一个好的框架,可以帮助您更加快速地使用Asp来完成您的网站开发任务.而Asp框架的终结者——IISNODE框架 ...

  3. jQuery File Upload

    jQuery File Upload介绍.............................................. 2 实现基本原理......................... ...

  4. 如何开始一个模块化可扩展的Web App(转)

    原文链接:http://avnpc.com/pages/start-a-modular-extensible-webapp 日志未经声明,均为AlloVince原创.版权采用『 知识共享署名-非商业性 ...

  5. NodeJS 入门第二天(EJS模板)

    一.复习 复习:Node.js开发服务器,数据.路由.本地关心的效果,交互: Node.js实际上是极客开发出的一个小玩具,不是银弹.有着别人不具备的怪异特点: 单线程.Non-blocking I/ ...

  6. NodeJS入门简介

    NodeJS入门简介 二.模块 在Node.js中,以模块为单位划分所有功能,并且提供了一个完整的模块加载机制,这时的我们可以将应用程序划分为各个不同的部分. const http = require ...

  7. HtmlWebpackPlugin用的html的ejs模板文件中如何使用条件判断

    折腾: [已解决]给react-hot-boilerplate中的index.html换成用HtmlWebpackPlugin自动生成html 期间,已经有了思路了,但是不知道如何在ejs的html中 ...

  8. EJS 入门学习

    EJS(Embedded JavaScript templates)是一个简单高效的模板语言,通过数据和模板,可以生成HTML标记文本.可以说EJS是一个JavaScript库,EJS可以同时运行在客 ...

  9. 前端组件库 - 搭建web app常用的样式/组件等收集列表(移动优先)

    0. 前端自动化(Workflow) 前端构建工具 Webpack - module bundler Yeoman - a set of tools for automating developmen ...

  10. node.js初识11

    1.EJS  Embedded JavaScript templates 模板引擎 .EJS的效率不高,因为他后台是通过字符串来处理的 <ul> <% for(var i = 0 ; ...

随机推荐

  1. STL: HDU1004Let the Balloon Rise

    Let the Balloon Rise Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Oth ...

  2. asp.net后台cs中的JSON格式变量在前台Js中调用方法

    //后台cs代码: using System; using System.Collections.Generic; using System.Linq; using System.Web; using ...

  3. 剑指offer 分行从上到下打印二叉树

    题目: 从上到下按层打印二叉树,同一层的节点按照从左到右的顺序打印,每一层打印到一行. /* struct TreeNode { int val; struct TreeNode *left; str ...

  4. vue中获取滚动table的可视页面宽度,调整表头与列对齐(每列宽度不都相同)

    mounted() { // 在mounted中监听表格scroll事件 this.$refs.scrollTable.addEventListener( 'scroll',(event) => ...

  5. MySQL第一讲 一一一一 数据库入门

    一. MySQL简介与安装 MySQL是一个关系型数据库管理系统,由瑞典MySQL AB 公司开发,目前属于 Oracle 旗下产品.MySQL 是最流行的关系型数据库管理系统之一,在 WEB 应用方 ...

  6. python 二分法实现

    # -*- coding: utf-8 -*- def BinarySearch(arr, key): # 记录数组的最高位和最低位 min = 0 max = len(arr) - 1 if key ...

  7. DRF之Jwt 实现自定义和DRF小组件及django-filter插件的使用

    一.DRF之Jwt 实现自定义 二.DRF(过滤,排序,分页)组件 三.Django-filter插件的使用和自定义 """ 1.drf-jwt手动签发与校验 :只是做t ...

  8. MySQL中Innodb的聚簇索引和非聚簇索引

    聚簇索引 数据库表的索引从数据存储方式上可以分为聚簇索引和非聚簇索引(又叫二级索引)两种.Innodb的聚簇索引在同一个B-Tree中保存了索引列和具体的数据,在聚簇索引中,实际的数据保存在叶子页中, ...

  9. 个人智能家居系统 - MQTT服务器搭建(centOS7.3)

    个人智能家居系统 - MQTT服务器搭建(centOS7.3) 0x00 参考 在CentOS7 上安装mosquitto1.4.1服务器,实现MQTT信息推送功能并增加websocket功能 mos ...

  10. 生成对抗网络 Generative Adversarial Networks

    转自:https://zhuanlan.zhihu.com/p/26499443 生成对抗网络GAN是由蒙特利尔大学Ian Goodfellow教授和他的学生在2014年提出的机器学习架构. 要全面理 ...