Easy Tutorial
❮ Prop Radio Form Dom Obj Document ❯

Map areas Collection

Map Object

Example

Get the number of <area> elements in an image map:

var x = document.getElementById("planetmap").areas.length;

x output value is:

3

Definition and Usage

The areas collection returns a collection of all <area> elements in an image map.

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

Tip: If you need to return a collection of href attributes from all <area> elements, you should use the links collection.


Browser Support

All major browsers support the areas collection.


Syntax

Properties

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

Methods

Method Description
[name_or_index] A string or integer specifying the element to retrieve (index starts at 0)
item(name_or_index) Returns the element from the collection with the specified index/name/id
namedItem(name_or_id) Returns the element from the collection with the specified name (name or id attribute)

More Examples

Example

[name_or_index]

Get the URL of the first <area> element in an image map:

var x = document.getElementById("planetmap").areas[0].href;

Example

item(name_or_index)

Get the URL of the first <area> element in an image map:

var x = document.getElementById("planetmap").areas.item(0).href;

Example

namedItem(name_or_id)

Get the URL of the <area> element with id="myArea" in an image map:

var x = document.getElementById("planetmap").areas.namedItem("myArea").href;

Example

Get the shape of all <area> elements in an image map:

var x = document.getElementById("planetmap");
var txt = "";
for (var i = 0; i < x.areas.length; i++) {
  txt = txt + x.areas[i].shape + "<br>";
}
document.getElementById("demo").innerHTML = txt;

Map Object

❮ Prop Radio Form Dom Obj Document ❯