动态添加到页面中一些内容

比如这种本来页面是这样的

<ul class="teacherAppList">

 <li><a href="1.html"><img src="1.png">优芽互动电</a</li>

<li><a href="2.html"><img src="2.png">错题本</a</li>

<li><a href="3.html"><img src="3.png">微课</a</li>

</ul>

但是那些a标签的href。图片还有文字内容都是通过接口获取的。他是循环出来的。所以我只在页面写了<ul class="teacherAppList"></ul>.然后它里面的li和a都要动态的从后台获取接口后拼接起来。

接口的url

$.ajax({

  url:'这里写接口的地址url';

 type:'post';

 dataType:'JSON';

data:{},

successful:function(resdata, textStatus, jqXHRult){

  if(resdata!=null){

      var teacherApp = resdata.teacherApp;

     $(".teacherAppList).html(getAppHtml(teacherApp));   //调用一个getAppList的方法。把你这个接口里面获取的内容传过去

  

   }

}

})

function  getAppHtml(arr){

var vhtml="";//定义一个空的内容等会放html的

for(var i=0;i<arr.length;i++){

   var d=arr[i];

   var homeurl=d.homepageUrl； //a的链接

   var picurl=d.picIcon;  //图片链接

   var appname=d.appName;  //课程名字

   vhtml+='<li><a href="'+d.homeurl+'"><img src="'+picurl+'">'+d.appname+'</a</li>';

}

return vhtml;

}