JavaScript模板引擎artTemplate.js——template.compile()方法
template.compile(source, options)
source:必传,渲染模板的内容。
options:可选,通常不传。(其实是我还没研究明白)
return:一个渲染函数。
示例如下:
<div id="content"></div> <script src="../js/template.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> var source = '<ul>' + '{{each list as value i}}' + '<li>索引 {{i + 1}} :{{value}}</li>' + '{{/each}}' + '</ul>'; var render = template.compile(source); var html = render({ list: ['摄影', '电影', '民谣', '旅行', '吉他'] }); document.getElementById('content').innerHTML = html; </script>
和template()方法的区别在于,template.compile()将渲染模板用javascript拼接实现,而前者是用script标签来展示,前者更为直观。
注:根据作者最新的升级信息,template.render()方法和template.compile()使用是一致的。
JavaScript模板引擎artTemplate.js——template.compile()方法的更多相关文章
- JavaScript模板引擎artTemplate.js——template.helper()方法
上一篇文章我们已经讲到了helper()方法,但是上面的例子只是一个参数的写法,如果是多个参数,写法就另有区别了. <div id="user_info"></d ...
- JavaScript模板引擎artTemplate.js——template()方法
template(id, data)方法: id:必传,渲染模板的id. data:可选,一个Object对象. return:传data—>渲染完成html代码:不传data—>一个渲染 ...
- JavaScript模板引擎artTemplate.js——两种方法实现性别的判定
template.helper(name, callback) name:必传,辅助事件的名称. callback:必传,辅助事件的回调函数. return:undefined 所谓的辅助事件,主要用 ...
- JavaScript模板引擎artTemplate.js——为什么使用模板引擎?
作为一个工作一年的菜鸟,在公司做了几个外包项目,也接触到了不同形式的web开发.其实也没多少,就是javaweb开发和HTML5移动开发,这两者在页面展示的时候的解决方案还是有所不同的. 1.vo+e ...
- JavaScript模板引擎artTemplate.js——如何引入模板引擎?
artTeamplate.js在github上的地址:artTemplate性能卓越的js模板引擎 引入模板引擎,就是引入外部javascript啦,并且artTemplate.js不依赖其他第三方库 ...
- JavaScript模板引擎artTemplate.js——是否编码输出html字符
template.config(name, value)方法用于更改引擎的默认配置. 其中字段escape,类型为boolean,默认为true. 首先,我们不修改配置信息输出一段带有html标签的字 ...
- JavaScript模板引擎artTemplate.js——结语
再次首先感谢模板的作者大神,再次放出github的地址:artTemplate性能卓越的js模板引擎 然后感谢博客园的一位前辈,他写的handlebars.js模板引擎教程,对我提供了很大的帮助,也是 ...
- JavaScript模板引擎artTemplate.js——引入子模板
之前的例子都是单一结构的对象,如果遇到复杂对象结构,我们可以通过引入子模板来实现html的渲染. 依旧以之前的数据作为例子: <div id="content">< ...
- 探究Javascript模板引擎mustache.js使用方法
这篇文章主要为大家介绍了Javascript模板引擎mustache.js使用方法,mustache.js是一个简单强大的Javascript模板引擎,使用它可以简化在js代码中的html编写,压缩后 ...
随机推荐
- js 阻止事件冒泡和默认行为 preventDefault、stopPropagation、return false
preventDefault: preventDefault它是事件对象(Event)的一个方法,作用是取消一个目标元素的默认行为.既然是说默认行为,当然是元素必须有默认行为才能被取消,如果元素本身就 ...
- Dev Winform 简洁界面模板制作
今天看到Dev的安装程序,发现界面很漂亮如下图: 于是想到做个类似的简洁明了的界面出来,平常开发小程序什么的都方便很多. 1.首先是自己添加了一个XtraForm,我们发现它有点丑(我为了性能,习惯把 ...
- 解析Javascript事件冒泡机制
本资源引自: 解析Javascript事件冒泡机制 - 我的程序人生 - 博客频道 - CSDN.NET http://blog.csdn.net/luanlouis/article/details/ ...
- iOS8 tableview separatorInset cell分割线左对齐,ios7的方法失效了
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 -(void)viewDidLayoutSubviews { if ([self.m ...
- Object-C关于GCD多线程的使用
```objc1 使用Crearte函数创建的并发队列和全局并发队列的主要区别: 1)全局并发队列在整个应用程序中本身是默认存在的并且对应有高优先级.默认优先级.低优先级和后台优先级一共四个并发队列, ...
- python之面向对象与构造函数
一.面向对象介绍 不同的编程范式本质上代表对各种类型的任务采取的不同的解决问题的思路, 大多数语言只支持一种编程范式, 当然也有些语言可以同时支持多种编程范式. 两种最重要的编程范式分别是面向过程编程 ...
- databtables 设置(显示)行号
var table = $('#priceStrategtyTable').DataTable({ "rowCallback": function( row, da ...
- vs.net Web.csproj.webinfo文件
使用VS工具打开工程的时候,请直接打开BookShop.sln文件, 请修改WEB/Web.csproj.webinfo文件中的<Web URLPath = "http://local ...
- Linux简介及常用命令使用3--vi编辑器
1.进入vi的命令 vi filename :打开或新建文件,并将光标置于第一行首 [新建文件]vi +n filename :打开文件,并将光标置于第n行首 [比如:某个shell报错的行数时使用] ...
- ANDROID开发中注意不同手机CPU架构对SO文件的不同需求。
如果没有对应于手机的SO文件,那么在调用第三方SDK时,会经常发生莫明其妙的错误.所以了解你调式或开发的目的手机CPU架构是很有必要的.