jq ajax请求遍历

记录一下昨天的懵逼操作，事情是这样的，项目需要出一个h5页面，用的tp5前后不分离，之前写h5都是用vue、uniapp各种框架来写，很长时间没搞这种html原生写法，怎么接收数据渲染页面呢

 

<script>
        $(function(){
          //请求参数
          var list = {};
          //
          $.ajax({
            //请求方式
            type : "get",
            //请求的媒体类型
            contentType: "application/json;charset=UTF-8",
            //请求地址
            url : "http://xxx/api/article/getArticleList?asname=edu",
            //数据，json字符串
            // data : JSON.stringify(list),
            //请求成功
            success : function(result) {
              console.log(result);
              let list = result.data;
              if(list.length > 0){
                  for(var i=0;i<list.length;i++){
                      var id = list[i].id;
                      var myList = "<div class=\"item\" id=\"list\">"
                          +"<div class=\"item-heading\">"
                            +"<div class=\"pull-right label label-success\">" +list[i].category_name
                            +"</div>"
                            +"<h4>"+ '<a href="../article/detail?id='+id+'">'+ list[i].title +"</a>" +"</h4>"
                          +"</div>"
                          +"<div class=\"item-content\">"
                            +"<div class=\"media pull-left\">"
                              +"<img src='__CDN__/assets/img/s1.png'>"
                            +"</div>"
                            +"<div class=\"text\">"+list[i].description+"</div>"
                          +"</div>"
                          +"<div class=\"item-footer\">"
                            // +"<a href=\"#\" class=\"text-muted\">"+"<i class=\"icon-comments\">"+"</i>"+ 243 +"</a>"+"&nbsp;"
                            +"<span class=\"text-muted\">"+list[i].create_time+"</span>"
                          +"</div>"
                        +"<div>";
                      $('#list').append(myList);
                  }
              }
            },
            //请求失败，包含具体的错误信息
            error : function(e){
              console.log(e.status);
              console.log(e.responseText);
            }
          });
        });

    </script>

呼哧呼哧，写了一堆js，搞完了突然想起来tp框架有模板语法，查了一下文档，volist，以前经常用的，r了dog

<div class="items">
        <div class="desc">功能介绍</div>
      {volist name="articleList" id="vo" }
        <div class="item" id="list">
            <div class="item-heading">
                <div class="pull-right label label-success">{$vo.id}</div>
                <h4><a href="###">HTML5 发展历史</a></h4>
            </div>
            <div class="item-content">
                <div class="media pull-left"><img src="__CDN__/assets/img/s1.png" alt=""></div>
                <div class="text">HTML 5草案的前身名为Web Applications 1.0，是在2004年由WHATWG提出。2008年1月22日，第一份正式草案发布。WHATWG表示该规范是目前仍在进行的工作，仍须多年的努力。[8]目前Mozilla Firefox、Google Chrome、Opera、Safari（版本4以上）、Internet Explorer（版本9以上）已支持HTML5技术。</div>
            </div>
            <div class="item-footer">
                <a href="#" class="text-muted"><i class="icon-comments"></i> 243</a> &nbsp; <span class="text-muted">2013-11-11 16:14:37</span>
            </div>
        </div>
        {/volist}
    </div>

就酱，刚写的时候咋就没想起来呢