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编写,压缩后 ...
随机推荐
- iOS UISearchController的使用
在iOS9中,UISearchDisplayController 已经被UISearchController替代.搜索框是一种常用的控件. 假设我们要满足下图的需求,产生100个“数字+三个随机字母” ...
- 把Sharepoint Desinger 工作流部署到生产环境
下面是比较简单的方法,把Designer工作流从开发环境部署到生产环境. 在Sharepoint Desinger 2013 中点击需要部署的工作流. 点击保存,发布. 点Export to Visi ...
- collection view 开发笔记
使用collectionView 注册的cell 不会调用 init 方法 会调用 initwith fram 方法.
- compileDebugJavaWithJavac
学习笔记 compileDebugJavaWithJavac,缺少插件,在module app gradle文件最上面添加一段 apply plugin: 'me.tatarka.retrolambd ...
- iOS开发-UI 从入门到精通(三)
iOS开发-UI 从入门到精通(三)是对 iOS开发-UI 从入门到精通(一)知识点的综合练习,搭建一个简单地登陆界面,增强实战经验,为以后做开发打下坚实的基础! ※在这里我们还要强调一下,开发环境和 ...
- javascript 实现des解密加密
//Paul Tero, July 2001 //http://www.tero.co.uk/des/ // //Optimised for performance with large blocks ...
- iOS团队风格的统一
不知不觉团队已经有了4个iOS开发,大家的代码风格完全不一样,所以每次改起别人的代码就头疼,理解起来不是那么顺畅,如鲠在喉.所以,就开了场分享会,把一些基本调用方法和代码风格统一了一下. 前言 主要参 ...
- React Native知识5-Touchable类组件
React Native 没有像web那样可以给元素绑定click事件,前面我们已经知道Text组件有onPress事件,为了给其他组件 也绑定点击事件,React Native提供了3个组件来做这件 ...
- Android 拍照后保证保证图片不失真,进行压缩
今天在网上找了一下参考,得出把图片压缩至KB 其他不想多说.直接上代码 拍完照后调用下面代码 BitmapUtils.compressBitmap(photoPath, photoPath, 640) ...
- Vs2013 html5开发WP8.1 APP之jquery
仿安卓原生界面,先使用JQM,最新的JQM使用了JQ1.8.5 然后在WP8以上就会遇到动态创建控件的安全性问题 换成JQ2.X即可,但在WP8.1中一定不要删除了 <script src=&q ...