Mar 17, 2020
1 min read
How to load ‘n’ number of images in HTML one by one using Javascript?
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.
