调用两个接口（每个接口给10张图片），要求交叉渲染出图片

js原生调用接口用XMLHttpRequest。多次调用需要写一个回调函数，在第一次调用完毕数据也发送成功以后，再次调用第二个接口。 成果地址如下：成果地址

function load(){
            loadXMLDoc('/php/index.php/admin/Report/fireText', function (data) {
                var titledata = data;
                loadXMLDoc('/php/index.php/admin/Report/dogText', function (data) {
                    var firedata = titledata.data;
                    var dogdata =data.data;   
					var ul=document.querySelector('ul');
                    for(var i=0;i<dogdata.length;i++){
                      //创建新节点
                      var li=document.createElement('li');
                      //创建一张火焰图片的li
                      li.innerHTML="<image src="+firedata[i].url+"></image>";
                      //插入ul
                      ul.appendChild(li);
                      //创建新节点
                      var li1=document.createElement('li');
                       //创建一张狗狗图片的li
                      li1.innerHTML="<image src="+dogdata[i].url+"></image>";
                      //插入ul
                      ul.appendChild(li1);
                    }
    				})
  				})
	}
        function loadXMLDoc(url, callback) {
          var xmlhttp;
          if (window.XMLHttpRequest) {
            xmlhttp = new XMLHttpRequest();
           }else{
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
           }

            xmlhttp.onreadystatechange = function () {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
                {
                    callback(JSON.parse(xmlhttp.response))
                }
            }
            xmlhttp.open("POST", url, true);
            xmlhttp.send();
 }

load();