普通图片加载//普通图片加载var imglist = [‘https://avatars3.githubusercontent.com/u/34082804?s=460&v=4’,’./img/2.jpg’,‘https://avatars3.githubusercontent.com/u/34082804?s=460&v=4’,‘https://github.githubassets.com/images/search-key-slash.svg’,’./img/2.jpg’,‘https://avatars3.githubusercontent.com/u/34082804?s=460&v=4’];loadImg(imglist);function loadImg(imglist){ var imgarr = []; var curimg = 0; var body = document.getElementsByTagName(‘body’); for(var i =0;i<imglist.length;i++){ var img = new Image(); img.src = imglist[i]; img.style.width = ‘200px’; img.id = i; img.onload = function(){ console.log(‘show ‘+this.id) } imgarr.push(img); body[0].appendChild(img); }}顺序加载图片方法1//顺序加载图片方法1、function loadImg(imglist){ var imgarr = []; var curimg = 0; var body = document.getElementsByTagName(‘body’); for(var i =0;i<imglist.length;i++){ var img = new Image(); img.src = imglist[i]; img.style.width = ‘200px’; img.onload = function(){ curimg +=1; if(curimg < imgarr.length){ body[0].appendChild(imgarr[curimg]); console.log(‘show ‘+curimg) } } imgarr.push(img); } body[0].appendChild(imgarr[0]);}promise方法//promise方法var imglist = [‘https://avatars3.githubusercontent.com/u/34082804?s=460&v=4’,’./img/2.jpg’,‘https://avatars3.githubusercontent.com/u/34082804?s=460&v=4’,‘https://github.githubassets.com/images/search-key-slash.svg’,’./img/2.jpg’,‘https://avatars3.githubusercontent.com/u/34082804?s=460&v=4’];var body = document.getElementsByTagName(‘body’);function loadimg(i){ var img = new Image(); img.src = imglist[i]; img.style.width = ‘200px’; img.id = i; body[0].appendChild(img); return new Promise(function(resolve,reject){ img.onload = function(){ console.log(‘show ‘+this.id) resolve(i+1) }; })}var a = Promise.resolve(0);var i=0;while(i<imglist.length-1){ a = a.then(function(i){ console.log(’load ‘+i) return loadimg(i) }); i++;}async 方法//async 方法async function loadImages(imglist){ for(var i =0; i<imglist.length; i++){ console.log(’load ‘+i) await loadImg(i); //执行完成之后才走下一步； console.log(‘finish ‘+i); }}async function loadImg(i){ var img = new Image(); img.src = imglist[i]; img.style.width = ‘200px’; img.id = i; body[0].appendChild(img); return new Promise(function(resolve,reject){ img.onload = function(){ console.log(‘show ‘+this.id) resolve(i+1); } })}