小猿圈利用JS判断多张图片加载情况

现在人的手机里有很多照片，但是你知道照片是怎么被储存的吗，那么多照片又是怎么加载的呢？通过什么手段加载的呢？下面小猿圈利用JS判断多张图片加载情况，希望对你的学习有所帮助。

可以采用es6中的Promise.all()来实现

let mulitImg = [

'http://www.3mooc.com/wp-content/uploads/2019/5/1.jpg',

'http://www.3mooc.com/wp-content/uploads/2019/5/2.jpg',

'http://www.3mooc.com/wp-content/uploads/2019/5/3.jpg',

'http://www.3mooc.com/wp-content/uploads/2019/5/4.jpg'

];

let promiseAll = [], img = [], imgTotal = mulitImg.length;

for(let i = 0 ; i < imgTotal ; i++){

promiseAll[i] = new Promise((resolve, reject)=>{

    img[i] = new Image()

    img[i].src = mulitImg[i]

    img[i].onload = function(){

          //第i张加载完成

          resolve(img[i])

    }

})

}

Promise.all(promiseAll).then((img)=>{

//全部加载完成

})

以上就是小猿圈对于利用JS判断多张图片加载情况的，学习是一个需要坚持的，不仅要付出相应的努力，还有相应时间，所以你要辜负自己，坚持下去，如果遇到问题可以到小猿圈网站去寻找答案前端自学交流群：820024416，相信会有意想不到的效果，快去看吧。