doT.js 学习
刚来公司第二天就让我做app,以前也没接触过,后来发现用apicloud开发app很简单,就是apicloud本身有点坑。
期间遇到了一个模板doT,觉得挺有意思的。想总结一下:
1)doT.js 是一个模板框架,在web前端使用。主要用途是在写好的模板上放入数据,生成含有数据的HTML代码。使用前要导入doT.min.js
2)常用的模板:
{{= }} for interpolation //赋值操作
{{ }} for evaluation //循环操作
{{~ }} for array iteration //数组操作
{{? }} for conditionals //条件操作
{{! }}赋值并且编码
目前为止我只用到了{{= }} 和{{ }} 只要不是HTML代码都要用{{}}包起来
3)调用方式:var tmpText = doT.template(模板);
tmpText(数据源);
4)特点:doT.js特点是快,小,无依赖其他插件
5)案例:
区域:<div id="interpolation"></div>
模板:
<script id="interpolationtmpl" type="text/x-dot-template">
<div>Hi {{=it.name}}!</div>
<div>{{=it.age || ''}}</div>
</script>
调用方式:
var dataInter = {"name":"Jake","age":31};
var interText = doT.template($("#interpolationtmpl").text());
$("#interpolation").html(interText(dataInter));
interText(dataInter) 相当于 {{=it.name}}中的it