ajax请求后台数据，并将其渲染在页面中

一、ajax的定义
AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）
AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。
AJAX 不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行。
二、例子
（1）将下面的请求到的数组渲染到页面中

（2）主要代码

<ul id="sendList"></ul>
<script type="text/javascript" src="js/jquery-2.1.4.min.js" ></script>
<script>
$(document).ready(function() {
    
    
    var htmlList="";
    var deliveryManGuid=sessionStorage.getItem('deliveryManGuid');
    var setoken=sessionStorage.getItem('setoken');
    console.log('获取参数',deliveryManGuid,"参数2",setoken);
    $.ajax({
    
    
     type:"GET",
     url:"请求的URL",
     async:true,
     beforeSend: function(request) {
    
    
          //将cookie中的token信息放于请求头中
          request.setRequestHeader("Access-Token", setoken);
     },
     data:{
    
    
      deliveryManGuid:deliveryManGuid
     },
     success: function(res) {
    
    
      if (res.Status == true) {
    
    
       console.log('成功返回信息',res); //成功返回信息      
       for(i=0;i<res.Data.length;i++){
    
       
        htmlList+='<li><a><div class="ltop"><span class="cantee" id="cname">'+res.Data[i].orderComName+'</span><span class="status">待配送</span></div>'
        +'<div class="otime"><img src="img/shijian.png" class="shijian">'+'下单时间：'+'<label class="orderPayTime">'+res.Data[i].orderPayTime+'</label></div>'
        +'<div class="oaddress"><img src="img/dizhi.png" class="adress">'+'派送地址：'+'<label id="padress">'+res.Data[i].orderAddress+'</label></div></a></li>';
        $('#sendList').html(htmlList);
       }      
      }
     },
     error:function(){
    
    
      alert(res.message)
     }
    });
   })
  </script>

（3）最后的效果：