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 ; ...
随机推荐
- swtich和case语句中,定义变量要加花括号
转自: http://blog.chinaunix.net/uid-27103408-id-3340702.html http://www.xuebuyuan.com/2070170.html swi ...
- Linux中的各种锁及其基本原理
Linux中的各种锁及其基本原理 1.概述 通过本文将了解到如下内容: Linux系统的并行性特征 互斥和同步机制 Linux中常用锁的基本特性 互斥锁和条件变量 2.Linux的并行性特征 Linu ...
- unsolved question's solution
因为很懒,没有时间,只会口胡等等原因,所以有些题目就不打code了 $luogu:$ P1973 [NOI2011]Noi嘉年华: 时间离散化,预处理一个区间$[l,r]$内的最多活动个数$in[l] ...
- git的配置设置
git的基本配置 git是一个版本控制工具,既然是工具,那么就可以根据人的个人喜好来进行设置,git也提供了配置,可以根据自己的喜好来对它进行个性化的设计,以让自己舒服的玩. git有三个配置文件 / ...
- dockerfile制作笔记
dockerfile语法格式: FROM: 基础镜像(就是在什么镜像上面做) MAINTAINER: 镜像创建者信息(作者的信息) EXPOSE: 开放的端口 ENV: 设置变量 ...
- windows下挂载NFS共享目录
1.在打开或关闭Windows功能中,选择安装NFS客户端 2.在命令行中,输入“mount \\172.24.184.31\data x:\”,输入mount查看详细挂载参数(注意此时uid.gid ...
- dll和ocx的区别
ActiveX,OLE是基于COM的一种应用,其文件后缀一般以dll和ocx结尾:ocx作为一种特殊的dll文件,具有一定的用户界面和事件响应,而dll文件只是方法和属性的集合. 一.关于DLL的介绍 ...
- 洛谷 P2704 [NOI2001]炮兵阵地 (状态压缩DP+优化)
题目描述 司令部的将军们打算在NM的网格地图上部署他们的炮兵部队.一个NM的地图由N行M列组成,地图的每一格可能是山地(用"H" 表示),也可能是平原(用"P" ...
- man(2) V
vfork(2) #include <sys/types.h> #include <unistd.h> pid_t vfork(void); 功能:创建子进程并阻塞父进 --- ...
- ASP.NET Core 基础知识(一) ASP.NET Core是什么?与.NET Framework、Mono之间的关系 ?
一.概念: ASP.NET Core 是一个开源的.跨平台的 .NET 实现.而 .NET Framework 是基于 Windows 的 .NET 实现,Mono 是 .NET Framework ...