promise加载图片
Posted rickdiculous
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了promise加载图片相关的知识，希望对你有一定的参考价值。
实现一个图片的加载；设置第一张图片加载1s之后加载第二张图片:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>2-4编程练习</title> </head> <body> <script> //获取body元素 let el = document.querySelector(‘body‘); //设置一个函数,把图片的url地址作为参数 function img(url){ //实例化promise对象 return new Promise(resolve => { setTimeout(function(){ //建立图像对象 var img = document.createElement(‘img‘); //设置图片的地址 img.setAttribute(‘src‘,url); //把图片节点插入到body中 el.append(img); //图片加载完成后执行resolve resolve(); },1000) }) } img(‘http://climg.mukewang.com/5b16558d00011ed506000338.jpg‘) .then(function(){ console.log(2); return img(‘http://climg.mukewang.com/5b165603000146ca06000338.jpg‘) }) .then(function(){ console.log(3) return img(‘http://climg.mukewang.com/5b1656140001c89906000338.jpg‘) }) </script> </body> </html>
以上是关于promise加载图片的主要内容，如果未能解决你的问题，请参考以下文章