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 & 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的更多相关文章
- [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. ...
- 全新ASP框架——IISNODE介绍
Asp是一门经典的动态网页编程语言,通常使用vbscript或者Jscript脚本来实现.一个好的框架,可以帮助您更加快速地使用Asp来完成您的网站开发任务.而Asp框架的终结者——IISNODE框架 ...
- jQuery File Upload
jQuery File Upload介绍.............................................. 2 实现基本原理......................... ...
- 如何开始一个模块化可扩展的Web App(转)
原文链接:http://avnpc.com/pages/start-a-modular-extensible-webapp 日志未经声明,均为AlloVince原创.版权采用『 知识共享署名-非商业性 ...
- NodeJS 入门第二天(EJS模板)
一.复习 复习:Node.js开发服务器,数据.路由.本地关心的效果,交互: Node.js实际上是极客开发出的一个小玩具,不是银弹.有着别人不具备的怪异特点: 单线程.Non-blocking I/ ...
- NodeJS入门简介
NodeJS入门简介 二.模块 在Node.js中,以模块为单位划分所有功能,并且提供了一个完整的模块加载机制,这时的我们可以将应用程序划分为各个不同的部分. const http = require ...
- HtmlWebpackPlugin用的html的ejs模板文件中如何使用条件判断
折腾: [已解决]给react-hot-boilerplate中的index.html换成用HtmlWebpackPlugin自动生成html 期间,已经有了思路了,但是不知道如何在ejs的html中 ...
- EJS 入门学习
EJS(Embedded JavaScript templates)是一个简单高效的模板语言,通过数据和模板,可以生成HTML标记文本.可以说EJS是一个JavaScript库,EJS可以同时运行在客 ...
- 前端组件库 - 搭建web app常用的样式/组件等收集列表(移动优先)
0. 前端自动化(Workflow) 前端构建工具 Webpack - module bundler Yeoman - a set of tools for automating developmen ...
- node.js初识11
1.EJS Embedded JavaScript templates 模板引擎 .EJS的效率不高,因为他后台是通过字符串来处理的 <ul> <% for(var i = 0 ; ...
随机推荐
- r子集代码实现(递归)
#!/usr/bin/env python #coding:utf-8 SET_START = 1 SET_END = 9 SUB_LEN = 10 def r_subset(i, r, pre, a ...
- CAS单点登录系统--进阶
2.CAS服务端数据源设置 2.1需求分析 我们现在让用户名密码从我们的优乐选的user表里做验证 2.2配置数据源 (1)修改cas服务端中web-inf下deployerConfigContext ...
- java中Map的put函数和get函数用法
---内容开始--- 没有比较完整的说明他们的用法,一般就只能看源函数,但是看起来比较的费劲. 那么究竟put函数和get函数的用法是如何的呢? 当然java中的Map集合是有Key和Value的. ...
- c# 杀死占用某个文件的进程
原文:c# 杀死占用某个文件的进程 需要使用微软提供的工具Handle.exe string fileName = @"H:\abc.dll";//要检查被那个进程占用的文件 Pr ...
- 自定义UICollectionViewLayout
UICollectionView在iOS6中第一次被介绍,也是UIKit视图类中的一颗新星.它和UITableView共享API设计,但也在UITableView上做了一些扩展.UICollectio ...
- 把excel中的数据导入到Oracle数据库中
从事工作以来,数据库一直使用oracle,却不知道excel导入oracle,今天看了一篇文章,分享给大家,希望对大家有用. https://jingyan.baidu.com/article/0f5 ...
- CodeBlocks17.12+汉化包下载及用法
本文已迁移至:https://blog.csdn.net/COCO56/article/details/95228780
- Linux shell 批量验证端口连通性
工作中会遇到验证到某某服务器端口是否连通,如果IP或端口多时,用shell还是很省时省力的,看下面的脚本: #!/bin/bash # #database check #set -o nounset ...
- 开发框架DevExtreme全新发布v19.1.3|附下载
DevExtreme Complete Subscription是性能最优的 HTML5,CSS 和 JavaScript 移动.Web开发框架,可以直接在Visual Studio集成开发环境,构建 ...
- man clock
CLOCK(3) Linux程序员手册 CLOCK(3) 名称 时钟-确定处理器时间 简介 #include <time.h> clock_t clock(void); ...