One way to create an img element with JavaScript is to use the Image constructor.
For instance, we can write:
const img = new Image(200, 300);
img.src = 'https://i.picsum.photos/id/487/200/300.jpg?hmac=jDYxTxKFMi18Gu5h9qt9ttwJKCk1-J6bZeHDtXGL2Vk';
document.body.appendChild(img)
We use the Image constructor with 2 arguments to create an img element.
The arguments are the width and height respectively.
Then we set the src property to the image URL to set the src attribute value.
And then we call document.body.appendChild with img to append it to the body.
Create an img Element with JavaScript with the document.createElement Method
Another way to create an img element with JavaScript is to use the document.createElement method.
For instance, we can write:
const img = document.createElement('img');
img.src = 'https://i.picsum.photos/id/487/200/300.jpg?hmac=jDYxTxKFMi18Gu5h9qt9ttwJKCk1-J6bZeHDtXGL2Vk';
document.body.appendChild(img)
to use:
const img = document.createElement('img');
to create an img element.
And the rest of the code is the same.