概述template.js是一个基于jquery的前端javascript模板，该插件主要解决数据渲染时繁琐的数据处理。模板解决了html片段拼接效率低下和繁琐的问题。看了很多相关的博客，博客的内容都差不多，很多知识点没有详细讲解。经过这两天的实验研究，我把研究的结果记录下来。模板标签1.{{each}}：双标签，用于遍历对象、数组或json对象。2.{{if}}：双标号，用于判断数据类型，条件可以是表达式。3.{{else}}：单个标签，与{{if}}标签一起使用。4.{{html}}：单标签，用于解析包含html片段的字符串。5.{{tmpl}}：单标签，用于模板嵌套。6.{{wrap}}：双标，wrapper，（没有什么使用奥妙，欢迎指点）模板常用常量变量和方法：（1）${var}：输出变量（2）{{=var}}：输出变量，注意等号后面必须跟一个空格（3）$item：表示当前模板（4）$data：表示数据源，即模板注入的数据（5）$index:表示使用each的Index(6)$value:表示使用each时的key-value方式：(1)$.tamplate(name,str):将指定的html代码段转换为指定名称的模板，命名模板名称，str代码段，并缓存数据。(2)$.tmpl(name,data)：核心方法，向模板中注入数据，并解析模板，命名模板名称，data：数据源(3)$.tmplItem(ele)：获取渲染使用的指定元素thetemplate数据，ele表示DOM节点(4)$(ele).tmpl(data)：本地方法，获取模板，向模板注入数据，解析模板(5)$(ele).tmplItem():获取并使用template在指定元素上渲染数据，ele表示DOM节点(6)$(ele).template(name):缓存ele节点中的数据，缓存的key为name。查看源码，发现是本地方法最终调用了全局方法。因此，全局方法是template.js的核心，局部方法只是辅助功能，为用户提供更灵活的获取模板、向模板注入数据、解析模板的方式。标签的使用{{each}}标签是双标签，使用时必须以{{/each}}标签结尾。使用时需要注意以下几点：(1)当数据源为数组时，可以不用this标签，模板会自动遍历数组。(2)使用方法一：{{eacharray|jsonObject}}，将数组或json对象放在标签名后，实现遍历方法，与jquery中的全局方法$.each()相同。源码也是通过$.each()实现的。这样就需要用模板变量$index来表示索引，用$value来表示索引值。使用方法二：{{each(key,value)array|jsonObject}}，使用该方法与方法一基本相同，唯一不同的是此时指定的是遍历时的key和value，而不是模板变量$index和$value，$index和$value不能同时使用。(3)需要注意的是，如果数据源不是数组而是复杂的数据类型，可以使用模板嵌套，将数据类型解析为数组的键值，这样就避免了多次使用each标签。{{if}}标签是双标签，使用时必须以{{/if}}标签结尾。使用方法：(1){{ifcondition}}：condition是一个条件表达式，与普通的if基本相同。(2)在逻辑判断中与{{else}}一起使用时，所有{{else}}标签都必须包含在{{if}}{{/if}}中。{{html}}{{tmpl}}{{wrap}}
