Javascript Reference - HTML DOM Area target Property

The target attribute specifies where to open the linked document.

The target property sets or gets the value of the target attribute of an area.

Browser Support


`target`	Yes	Yes	Yes	Yes	Yes

Syntax

Return the target property:

var v = areaObject.target

Set the target property:

areaObject.target='_blank|_self|_parent|_top|framename'

Parameter

Value	Description
_blank	Open the linked document in a new window
_self	Open the linked document in the same window. This is default
_parent	Open the linked document in the parent frameset
_top	Open the linked document in the full body of the window
framename	Open the linked document in a named frame

Return Value

A String representing where to open the linked document.

Example

The following code shows how to change the target for a specific area in an image-map.


<!DOCTYPE html>
<html>
<body>
<!--  w  w w. j  a v a  2s  . co  m-->
<img src="http://java2s.com/style/demo/border.png" 
width="145" height="126" usemap="#myImageMap">

<map name="myImageMap">
  <area id="myArea" shape="circle" coords="124,58,8" 
      alt="myImage" href="http://example.com">
</map>
<p id="demo"></p>

<button onclick="myFunction()">test</button>

<script>
function myFunction() {
    document.getElementById("myArea").target = "_blank";
    document.getElementById("demo").innerHTML = "changed";
}
</script>

</body>
</html>

The code above is rendered as follows:

Example 2

The following code shows how to get the target of a specific area in an image-map.


<!DOCTYPE html>
<html>
<body>
<!--from w  ww . j  a v a  2 s.  co  m-->
<img src="http://java2s.com/style/demo/border.png" 
     width="145" height="126" usemap="#myImageMap">

<map name="myImageMap">
  <area id="myArea" shape="circle" coords="124,58,8" 
      alt="myImage" href="http://example.com" target="_self">
</map>

<p id="demo"></p>

<button onclick="myFunction()">test</button>

<script>
function myFunction() {
    var x = document.getElementById("myArea").target;
    document.getElementById("demo").innerHTML = x;
}
</script>

</body>
</html>

The code above is rendered as follows: