Related Articles

Related Articles

HTML | DOM Map name Property
  • Last Updated : 05 Nov, 2019

The Map name property in HTML DOM is used to set or return the value of the name attribute of a map element. This attribute specifies the name of the mapping image. This attribute is associated with <img> usemap attribute. It creates a relationship between the <image> and <map> element.

Syntax:

  • It returns the name property.
    mapObject.name
  • It is used to set the name property.
    mapObject.name = name

Property Values:

  • name: It holds the name of the an image-map.

Return Value: It returns a string value which represents the name of the map element.

Example:



filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html> 
<html
  
<head
    <title
        HTML DOM Map name Property 
    </title
</head
  
<body
    <h2>
        GeeksForGeeks
    </h2>
  
    <h3>
        HTML DOM Map name Property 
    </h3>
      
    <h4>Click the button</h4>
      
    <map id = "Geeks" name = "Geeks"
          
        <area = "rect" coords = "0, 0, 110, 100"
                alt = "Geeks" href
  
        <area shape = "rect" coords = "110, 0, 190, 100"
                alt = "For" href
  
        <area shape = "rect" coords = "190, 0, 300, 100"
                alt = "GEEKS" href
    </map
      
    <img src
    width = "300" height = "100" alt="GFG" usemap = "#Geeks">
      
    <br><br>
      
    <button onclick = "GFG()"
        Click Here! 
    </button
      
    <p id = "GEEK!"></p
      
    <script
        function GFG() { 
            var x = document.getElementById("Geeks").name; 
            document.getElementById("GEEK!").innerHTML = x; 
        
    </script
</body>
  
</html>

chevron_right


Output:

  • Before Clicking the Button:
  • After Clicking the Button:

Example 2:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html> 
<html
  
<head
    <title
        HTML DOM Map name Property 
    </title
</head
  
<body
    <h2>
        GeeksForGeeks
    </h2>
  
    <h3>
        HTML DOM Map name Property 
    </h3>
      
    <h4>Click the button</h4
      
    <map id = "Geeks" name = "Geeks"
          
        <area = "rect" coords = "0, 0, 110, 100"
                alt = "Geeks" href
  
        <area shape = "rect" coords = "110, 0, 190, 100"
                alt = "For" href
  
        <area shape = "rect" coords = "190, 0, 300, 100"
                alt = "GEEKS" href
    </map>
      
    <img src
    width = "300" height = "100" alt="GFG" usemap = "#Geeks">
      
    <br><br>
      
    <button onclick = "GFG()"
        Click Here! 
    </button
      
    <p id = "GEEK!"></p
      
    <script
        function GFG() { 
            var x = document.getElementById("Geeks").name
                    = "Hello Geeks"; 
              
            document.getElementById("GEEK!").innerHTML
                    = "The name was changed to " + x; 
        
    </script
</body>
  
</html>

chevron_right


Output:

  • Before Clicking the Button:
  • After Clicking the Button:

Supported Browsers: The browsers supported by HTML DOM Map name property are listed below:

  • Google Chrome
  • Internet Explorer
  • Firefox
  • Safari
  • Opera

full-stack-img




My Personal Notes arrow_drop_up
Recommended Articles
Page :