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. swtich和case语句中,定义变量要加花括号

    转自: http://blog.chinaunix.net/uid-27103408-id-3340702.html http://www.xuebuyuan.com/2070170.html swi ...

  2. Linux中的各种锁及其基本原理

    Linux中的各种锁及其基本原理 1.概述 通过本文将了解到如下内容: Linux系统的并行性特征 互斥和同步机制 Linux中常用锁的基本特性 互斥锁和条件变量 2.Linux的并行性特征 Linu ...

  3. unsolved question's solution

    因为很懒,没有时间,只会口胡等等原因,所以有些题目就不打code了 $luogu:$ P1973 [NOI2011]Noi嘉年华: 时间离散化,预处理一个区间$[l,r]$内的最多活动个数$in[l] ...

  4. git的配置设置

    git的基本配置 git是一个版本控制工具,既然是工具,那么就可以根据人的个人喜好来进行设置,git也提供了配置,可以根据自己的喜好来对它进行个性化的设计,以让自己舒服的玩. git有三个配置文件 / ...

  5. dockerfile制作笔记

    dockerfile语法格式:   FROM: 基础镜像(就是在什么镜像上面做)   MAINTAINER: 镜像创建者信息(作者的信息)   EXPOSE: 开放的端口   ENV: 设置变量   ...

  6. windows下挂载NFS共享目录

    1.在打开或关闭Windows功能中,选择安装NFS客户端 2.在命令行中,输入“mount \\172.24.184.31\data x:\”,输入mount查看详细挂载参数(注意此时uid.gid ...

  7. dll和ocx的区别

    ActiveX,OLE是基于COM的一种应用,其文件后缀一般以dll和ocx结尾:ocx作为一种特殊的dll文件,具有一定的用户界面和事件响应,而dll文件只是方法和属性的集合. 一.关于DLL的介绍 ...

  8. 洛谷 P2704 [NOI2001]炮兵阵地 (状态压缩DP+优化)

    题目描述 司令部的将军们打算在NM的网格地图上部署他们的炮兵部队.一个NM的地图由N行M列组成,地图的每一格可能是山地(用"H" 表示),也可能是平原(用"P" ...

  9. man(2) V

    vfork(2) #include <sys/types.h> #include <unistd.h> pid_t vfork(void); 功能:创建子进程并阻塞父进 --- ...

  10. ASP.NET Core 基础知识(一) ASP.NET Core是什么?与.NET Framework、Mono之间的关系 ?

    一.概念: ASP.NET Core 是一个开源的.跨平台的 .NET 实现.而 .NET Framework 是基于 Windows 的 .NET 实现,Mono 是 .NET Framework ...