jquery.tmpl模板是用模版生成html的框架其中的一种。
首先需要下载tmpl文本,引入到你的html文件中,在html文件中写代码
举例:
<!DOCTYPE html> <html> <body> <head> <script type="text/javascript" src="../javascript/item_list.js" ></script> <script type="text/javascript" src="../javascript/jquery.tmpl.min.js" ></script> <script id="form" type="text/x-jquery.tmpl"> <tr> <td>${classification}</td> <td>${name}</td> <td>${price}</td> <td>${unit}</td> </tr> </script> </head>
${}:花括号里面放的是变量,也可以放表达式。等价于{{= }}需要注意的是等号后面有空格的。
那当我需要渲染的时候该怎么办呢?
代码:$(#form).tmpl( )
$(#form):是选取要进行渲染的标签,tmpl( )将传入的json对象绑定到模板上。
当我把对象绑定到模板上然后在哪展示呢
<div> <table id="product_list"> <thead> <tr> <th>分类</th> <th>名称</th> <th>单价(元)</th> <th>单位</th> <th></th> </tr> </thead> </table> </div>
所以我写了个表头
appendTo()被选元素的结尾插入指定元素。
$(#form).tmpl( ).appendTo(#product_list):将json文件绑定模板,需要渲染东西标签添加到标签id为product_list下。