buglessir/Download and show one by one Images with JavaScript and Promise

## Download and show one by one Images with JavaScript and Promise
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
  img{
    width: 150px;
    height: auto;
  }
</style>
</head>
<body>
<div id="container"></div>
<script>
  var container = document.getElementById('container');
  var images_url = ['Image_URL_ONE', 'Image_URL_TWO', 'Image_URL_THREE', /* other URLs... */];

  function loadImageByPromise(url) {
    return new Promise(function(resolve) {
      let img = document.createElement('img');
      img.src = url;
      img.onload = function() {
        resolve(img);
      }
    });
  }

  (async function() {
    for (var url of images_url) {
      var img = await loadImageByPromise(url);
      container.appendChild(img);
    }
  })();
</script>
</body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<style>
	img{
	width: 150px;
	height: auto;
	}
	</style>
	</head>
	<body>
	<div id="container"></div>
	<script>
	var container = document.getElementById('container');
	var images_url = ['Image_URL_ONE', 'Image_URL_TWO', 'Image_URL_THREE', /* other URLs... */];

	function loadImageByPromise(url) {
	return new Promise(function(resolve) {
	let img = document.createElement('img');
	img.src = url;
	img.onload = function() {
	resolve(img);
	}
	});
	}

	(async function() {
	for (var url of images_url) {
	var img = await loadImageByPromise(url);
	container.appendChild(img);
	}
	})();
	</script>
	</body>
	</html>