使用artTemplate的模板引擎,使用简单

闲话不多说   直接上代码
 
 
html的模板  也使用判断语句  简单实用
<script src="http://aui.github.com/artTemplate/"></script>   //=====引入template.js文件
<script id="templateId" type="type/html">
{{each rows as value2 i}}
  <li class="li_list" data-id="{{value2.id}}" data-name="{{value2.city}}">
  <a href="javaScript:;">
    <div class="left_box">
    <div class="r_city">{{value2.area}}</div>
  {{if value2.agent && value2.tel}}
    <div class="l_name">{{value2.agent}}</div>
    <div class="l_phone">{{value2.tel}}</div>
  {{else}}
    <div class="l_none">未设置代理</div>
  {{/if}}
  </div>
  <div class="right_box">
    <button id="getPopup1" type="button" class="r_button getPopup1">设置</button>
  </div>
  </a>
</li>
{{/each}}
</script>
//=====js请求
$.ajax({
  url: url,
  data: data,
  type: post,
  header: {'content-type': 'application/json'},
  dataType: 'json',
  success: function(res){
    console.log(res)
    if(res.code==200){
      let result = template('templateId',{rows: res.data})  //===注意点:  模板上得rows要跟template上得rows对应
      $('ul').html(result) //===直接赋值就可以实现了
    }  
  }
 
 
})
 

原文地址:https://www.cnblogs.com/PinkYun/p/9890133.html