laytpl模板引擎使用实例1

来源：互联网发布：朱少民软件测试视频编辑：程序博客网时间：2024/06/09 17:46

使用效果图

使用laytpl模板引擎进行动态渲染

使用实例代码

<!DOCTYPE html><html lang="zh-CN"><head><title>laytpl测试</title><script type="text/javascript">$(function(){//渲染模板function render(tpl,data){var retuHtml="";laytpl(tpl).render(data, function(html){retuHtml=html;});return retuHtml;}$("#btn").click(function(){$.ajax({url:ctxs+"/product/productSpu/selectBrand2.htm",type:'POST',data:data,dataType:'json',success:function(data){if(data!=null){$("#brandUl").html("");for(var i=0;i<data.length;i++){var brandTpl = $("#brandTpl").html();//模板var dataJson={"brand":data[i]};var brandLi=render(brandTpl,dataJson);$("#brandUl li").append(brandLi);}}}});});});</script></head><body><button type="button" id="btn">点击</button><ul id="brandUl"><li>laytpl测试拼接</li></ul>    <script type="text/template" id="brandTpl"><li><a href="javascript:void(0);" name="selectBrand" brandId="{{d.brand.id}}" brandName="{{d.brand.name}}"><b>选择</b><span>{{d.brand.firstLetter}}-{{d.brand.name}}</span></a></li></script></body></html>

阅读全文

1 0