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 ; ...
随机推荐
- Quartz-第三篇 quartz-misfire 错失,补偿执行
1.问题:使用pauseJob()后,再使用resumeJob(). Job如果中间时间足够短,默认会将之前错失的次数执行回来.这个问题的原因是执行调度策略的问题,quartz框架默认会将错失的执行次 ...
- JS案例经验二
一 关键词:鼠标事件的触发 可以在函数中指定让鼠标事件自动触发,而不是必须要鼠标滑过才触发,例如: main.onmouseover(); // 可以把该语句看做是鼠标滑过的模拟动作 main是DOM ...
- Luogu P4040 [AHOI2014/JSOI2014]宅男计划
题目 显然存活天数与叫外卖次数的函数是凸函数. 所以三分买外卖的次数. 然后把食品按保质期升序排序. 并且单调栈搞一下,把又贵又保质期短的丢掉. 那么随着保质期的增加,食品的价格一定上涨. 所以我们从 ...
- 图——图的Dijkstra法最短路径实现
1,最短路径的概念: 1,从有向图中某一顶点(起始顶点)到达另一顶点(终止顶点)的路径中,其权值之和最小的路径: 2,问题的提法: 1,给定一个带权有向图 G 与起始顶点 v,求从 v 到 G 中其它 ...
- 使用CSDN-markdown编辑器粘贴代码块时崩溃问题解决
原因:代码段换行符失效,所有代码一行显示 解决方法:使用Chrome浏览器即可解决(使用Microsoft Edge会出现此问题) 效果展示: # _*_ coding:utf-8 _*_ impor ...
- HNUSTOJ 1444:树的最长路径
1444: 树的最长路径 时间限制: 1 Sec 内存限制: 128 MB 提交: 18 解决: 7 [提交][状态][讨论版] 题目描述 定义:无向树中结点的路径为该结点所能到达的最远距离:无向 ...
- object in javascript
枚举对象属性 for....in 列举obj的可枚举属性,包括自身和原型链上的 object.keys() 只列举对象本身的可枚举属性 创建对象的几种方式 对象字面量 const pre='test' ...
- Jafka源码分析——网络架构
在kafka中.每个broker都是一个server.依照一般理解,server就是一个SocketServer,其不断接收用户的请求并进行处理.在Java中进行网络连接有两种方式一种为堵塞模式一种为 ...
- 利用中转输出表制作HijackDll
[原创]利用中转输出表制作HijackDll(附工具源码)作 者: baixinye时 间: 2012-08-05,16:48:45链 接: http://bbs.pediy.com/showthre ...
- JS事件流、事件监听、事件对象、事件委托
JS事件流: 01.DOM级别和DOM事件 02.JS事件流:页面中接收事件的顺序 事件冒泡阶段-->处于目标阶段-->事件捕获阶段 (事件捕获总发生在事件冒泡前面) 03.捕获:从外向里 ...