HTML DOM Document images
Example
The number of <img> elements in the document:
document.images.length;
Try it Yourself »
Loop over all <img> elements, and output the URL (src) of each:
const myImages = document.images;
let text = "";
for (let i = 0; i < myImages.length; i++) {
text += myImages[i].src + "<br>";
}
Try it Yourself »
The URL of the first <img> element is:
document.images[0].src;
Try it Yourself »
The URL of the first <img> element is:
document.images.item(0).src;
Try it Yourself »
More examples below.
Description
The images property returns a collection of all <img> elements in a document.
The images property returns an HTMLCollection.
The images property is read-only.
Note
The images property does not return <input> elements with type="image".
See Also:
HTMLCollection
An HTMLCollection is an array-like collection (list) of HTML elements.
The length Property returns the number of elements in the collection.
The elements can be accessed by index (starts at 0).
An HTMLCollection is live. It is automatically updated when the document is changed.
Syntax
document.images
Properties
| Property | Description |
| length | The number of <img> elements in the collection. |
Methods
| Method | Description |
| [index] | Returns the element with the specified index (starts at 0). Returns null if the index is out of range. |
| item(index) | Returns the element with the specified index (starts at 0). Returns null if the index is out of range. |
| namedItem(id) | Returns the element with the specified id. Returns null if the id does not exist. |
Return Value
| Type | Description |
| Object | An HTMLCollection Object. All <img> elements in the document. The elements are sorted as they appear in the document. |
More Examples
The URL of the <img> element with id="myImg" is:
document.images.namedItem("myImg").src;
Try it Yourself »
Add a black border to the first <img> element:
document.images[0].style.border = "10px dotted black";
Try it Yourself »
Browser Support
document.images is a DOM Level 1 (1998) feature.
It is fully supported in all browsers:
| Chrome | Edge | Firefox | Safari | Opera | IE |
| Yes | Yes | Yes | Yes | Yes | 9-11 |
