Area href Property - Javascript DOM HTML Element

Javascript examples for DOM HTML Element:Area

  1. HOME
  2. Javascript
  3. DOM HTML Element
  4. Area

Description

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

The href attribute sets the destination of a link in an area.

Set the href property with the following Values

Value Description
URL Sets the hyperlink target for the area.

Possible values for href:

  • An absolute URL - points to another web site, like href="http://www.example.com/sun.htm"
  • A relative URL - points to a file within a web site, like href="sun.htm"
  • Link to an element with a specified id within the page, like href="#top" or href="http://www.example.com/sun.htm#id"
  • Protocols, like https://, ftp://, mailto:, file:, etc..
  • A script, like href="javascript:alert('Hello');"

Return Value

A String, representing the entire URL, including the protocol (like http://)

The following code shows how to Change the URL of a link in an area:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<body>

<img src="http://java2s.com/resources/a.png" width="145" height="126" usemap="#myMap">

<map name="myMap">
  <area id="myId" shape="circle" coords="125,60,10" alt="Venus" href="venus.htm">
</map>//from w ww.  j av a  2  s .  c om

<button onclick="myFunction()">change the value of the href attribute</button>

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

<script>
function myFunction() {
    document.getElementById("myId").href = "sun.htm";
    document.getElementById("demo").innerHTML = "The link now goes to sun.htm.";
}
</script>

</body>
</html>

Related Tutorials