How to load ‘n’ number of images in HTML one by one using Javascript?
1 min readMar 17, 2020
Suppose there are 100 of images and you want to render them one by one in HTML.
<html><body><div id="container"></div><script>const images = ['https://fakeimg.pl/300/', 'https://media.geeksforgeeks.org/wp-content/uploads/20190529122828/bs21.png', 'https://fakeimg.pl/400/', 'https://fakeimg.pl/100/'];const loadImages = (images) => { images.forEach((image) => { const img = document.createElement('img'); img.src = image; document.getElementById('container').appendChild(img);})};loadImages(images);</script></body></html>
You can add `n` number of images in Array
Output
write in the comment section if you have any question or suggestion.
Please give a clap if this post helps you.