In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > HTML DOM > properties > name (map)

name property (map)

Browser support:

Sets or retrieves the name of an image map that helps to establish a relationship between an image and an image map.

Use the name of an image map for the value of the an image element's useMap property to establish a relationship between an image and an image map. See Example 1 for details.

The name property can be used as a reference on the client side. You can get an array of elements that have the same name with the getElementsByName method.

Syntax:

object.name;

You can find the related objects in the Supported by objects section below.

This property is read/write.

HTML page for this property: name

Possible values:

String that sets or retrieves the name of the image map.

Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the name attribute:

<img src="area.gif" width="504px" height="126px" border="0px" alt="Solar System" usemap="#SampleMap" />
<map name="SampleMap">
    <area shape="rect" coords="1,-1,83,125" alt="rectangle" href="#" />
    <area shape="circle" coords="234,57,30" alt="circle" href="#" />
    <area shape="poly" coords="363,37,380,40,399,35,420,47,426,63,423,78,430,94,409,90,395,92,379,84,371,67,370,57" alt="polygon" href="#" />
</map>

Copy Code

Preview

Syntax Highlighter

Did you find this example helpful? yes no

Example HTML code 2:

This example illustrates the use of the name property and the getElementsByName method:

<head>
    <script type="text/javascript">
        function CollectByName () {
            var tags = document.getElementsByName ("SampleMap");
            var count = tags.length;
            alert ("There are " + count + " element(s) with the specified name attribute: " + tags[0].name);
        }
    </script>
</head>
<body>
    <img src="area.gif" width="504px" height="126px" border="0px" alt="Solar System" usemap="#SampleMap" />
    <map name="SampleMap">
        <area shape="rect" coords="1,-1,83,125" alt="rectangle" href="#" />
        <area shape="circle" coords="234,57,30" alt="circle" href="#" />
        <area shape="poly" coords="363,37,380,40,399,35,420,47,426,63,423,78,430,94,409,90,395,92,379,84,371,67,370,57" alt="polygon" href="#" />
    </map>
    <button onclick="CollectByName ()">Collect elements by name</button>
</body>