//===结构代码
<img src="./loading.gif" />
//===首先在页面显示的是一个loading图 当请求返回的时候把返回的图片替换上去
//====js代码
let imgArr = [
'./beautiful.jpg',
'./beautiful.jpg',
'./beautiflu.jpg',
'./beautiful.jpg',
]
let imgwrap =[ ]
function perloading (arr) {
fror(let i=0;i<arr.length;i++) {
//可省略 imgwrap[i] = new Image()
//可省略 imgwrap[i].src =arr[i]
//===在这里使用setTimeout模拟网络请求
setTimeout(()=>{
$('.img').src= arr[i]
},1000)
}
}
//====调用函数
perloading(imgArr)
页面打开时的效果图
请求返回后的效果: