artTemple是一个简朴高效地JavaScript模板引擎,比拟于jsRender这类庞杂的模板引擎,artTemple就显得很“娇小”。你险些能够在网上恣意搜一篇博客或许文章,10分钟的时刻你就可以基础的控制它得用法(附上网站:http://www.jq22.com/jquery-in…)。有兴致的朋侪能够本身去这个网站上看,内里都有其的特征啊,一些经常运用的api和例子。
写这篇文章只是为了申明一下本人在运用jsRender和artTemple时刻发明它们之间的一个小差别想和人人分享一下:
起首,给出衬着数据:
var data = {
title: '标签',
list: [
{
itemTitle:科目,
dataItem:['语文','数学']
}
]
};
在artTemple中衬着模板:
<script id="test" type="text/html">
<h1>{{title}}</h1>
<ul>
{{each list as value i}}
<li>索引 {{i + 1}}</li>
{{each value.dataItem as item j}}
<span>{{j+1}}:{{value.itemTitle}}</span>
{{/each}}
{{/each}}
</ul>
</script>
用过jsRender的朋侪们会有个挺揪心的题目就是在嵌套数组数据中,怎样在dataItem数组循环中援用与dataItem同级或许之上几级的数据。jsRender中就须要运用#parent属性一步一步的去计算出所须要援用的数据相对于dataItem的级数,然后才准确援用。由于在jsRender的数组援用中谁人没有类似于artTemple模板数组援用中的数组子项申明(上面例子中的value或许item)。在artTemple中要实如今dataItem数组循环中援用与dataItem同级或许之上几级的数据就简朴多了,只需如上述例子中一样,绑定数组子项(value)就好了。