3-1
<div id="app">
</div>
<script>
var arr = [
{name:"cheng",age:18},
{name:"li",age:17}
]
arr.forEach((item,index)=>{
var html = `
<div class="item">
<span>${index+1}</span>
<span >${item.name}</span>
<span>${item.age}</span>
</div>
`
$("#app").append(html)
})
</script>
3-2获取豆瓣的页面内容
<div class="movie">
</div>
<div class="right">
</div>
<script>
var url = "http://192.168.4.18:8000";
ajax({
url,
method: "get",
success: res => {
console.log(res);
res.result.forEach((item, index) => {
var html = `
<div class="movie1">
<div class="img">
<span>${index + 1}</span>
<img src=${item.pic}>
</div>
<div class="text">
<p class="title">${item.title}</p>
<p class="labels">${item.labels.join("/")}</p>
<p class="raiting">评分${item.raiting}<sapn class="evaluate"> ${item.evaluate}评价</sapn></p>
<p class="slogo">${item.slogo}</p>
</div>
</div>
`
$(".movie").append(html);
})
}
})
var url = "http://192.168.4.18:8000/ad"
ajax({
url,
method: "get",
success: res => {
console.log(res);
var html = `
<div slass="right1">
<p class="introduce">${res.result.title}</p>
<img src=${res.result.poster}>
<div class="footer">
<div class="img1"><img src=${res.result.erweima}></div>
<div class="img2"><img src=${res.result.logo}></div>
<div class="txt">
<p class="main-tittle">${res.result.labels[0]}</p>
<p class="sub-tittle">${res.result.labels[1]}</p>
</div>
</div>
</div>
`
$(".right").append(html);
}
});
</script>
3-3获取网易云页面内容
var url="http://192.168.4.18:3000/banner";
ajax({
url,
method:"get",
success:res=>{
console.log(res);
res.banners.forEach(item=>{
// console.log(item.imageUrl)
var html=`
<img src=${item.imageUrl}>
`
$("#list").append(html)
})
}
})
var url="http://192.168.4.18:3000/top/playlist?cat=华语"
ajax({
url,
method:"get",
success:res=>{
function go(value){
if(value>10000){
return value=Math.floor(value/10000)+"万"
}
return value
}
console.log(res)
res.playlists.forEach(item=>{
console.log(item.coverImgUrl)
var html=`
<div class="img1">
<img src=${item.coverImgUrl}>
<p class="one">
<span class="ear"></span>
<span class="fan">${go(item.playCount)}</span>
<span class="play"></span>
</p>
<p>${item.name}</p>
</div>
`
$(".r-content").append(html)
})
}
})