X
HOME HTML CSS JAVASCRIPT SQL PHP JQUERY ANGULAR XML ASP.NET MORE...
REFERENCES | EXAMPLES | FORUM | ABOUT

HTML DOM images Collection

Document Object Reference Document Object

Example

Show the number of <img> elements in the document:

var x = document.images.length;

The result of x will be:

3

Try it yourself »


Definition and Usage

The images collection returns a collection of all the <img> elements in the current document.

Note: The elements in the collection are sorted as they appear in the source code.

Note: The images collection does not return a collection of <input> elements with type="image".


Browser Support

Internet Explorer Firefox Opera Google Chrome Safari

The images collection is supported in all major browsers.


Syntax

document.images

Properties

Property Description
length Returns the number of <img> elements in the collection

Methods

Method Description
[index] An integer that specifies the element to retrieve (starts at 0)
item(index) Returns the element from the collection with the specified index (starts at 0)
namedItem(id) Returns the element from the collection with the specified id


More Examples

Example

Loop through all <img> elements in the document, and output the URL of each image:

var x = document.images;
var txt = "";
for (var i = 0; i < x.length; i++) {
    txt = txt + x[i].src + "<br>";
}

The result of txt will be:

http://www.w3schools.com/jsref/klematis.jpg
http://www.w3schools.com/jsref/klematis2.jpg
http://www.w3schools.com/jsref/smiley.gif

Try it yourself »

Example

[index]

Get the URL of the first <img> element (index 0) in the document:

var x = document.images[0].src;

The result of x will be:

http://www.w3schools.com/jsref/klematis.jpg

Try it yourself »

Example

item(index)

Get the URL of the first <img> element (index 0) in the document:

var x = document.images.items(0).src;

The result of x will be:

http://www.w3schools.com/jsref/klematis.jpg

Try it yourself »

Example

namedItem(id)

Get the URL of the <img> element with id="myImg" in the document:

var x = document.images.namedItem("myImg").src;

The result of x will be:

http://www.w3schools.com/jsref/smiley.gif

Try it yourself »


Related Pages

JavaScript reference: HTML DOM Image Object

HTML tutorial: HTML Images

HTML reference: HTML <img> tag


Document Object Reference Document Object

Your suggestion:

Close [X]

Thank You For Helping Us!

Your message has been sent to W3Schools.

Close [X]
Search w3schools.com:

WEB HOSTING

UK Reseller Hosting

WEB BUILDING

Download XML Editor FREE Website BUILDER Free HTML5 Templates FREE Website Templates Free HTML Templates

SHARE THIS PAGE

facebook