HTML | DOM Link href Property
The HTML | DOM Link href Property is used to set or return the URL of a Linked Document.
Syntax:
- It return the href property.
linkObject.href
- It is used to Set the href property.
linkObject.href = URL
Property Values: It contains the value i.e URL which specify the URL of the link.
- absolute URL: It points to another website.
- relative URL: It points to a file within a website
Return Value: It returns a string value which represents the URL of the Linked document.
Example-1: This Example returns a href Property.
HTML
<!DOCTYPE html> < html > < head > < link id="linkid" rel="stylesheet" type="text/css" href="styles.css" sizes="16*16" hreflang="en-us"> </ head > < body style="text-align:center;"> < h1 >w3wiki</ h1 > < h2 >DOM Link href Property</ h2 > < button onclick="gfg()">Get URL </ button > < p id="pid" style="font-size:25px; color:green;"> </ p > < script > function gfg() { // return Link href Property var NEW = document.getElementById( "linkid").href; document.getElementById( "pid").innerHTML = NEW; } </ script > </ body > </ html > |
Output:
Before Clicking On Button:
After Clicking On Button:
Example-2: This Example sets the href Property.
HTML
<!DOCTYPE html> < html > < head > < link id="linkid" rel="stylesheet" type="text/css" href="styles.css" sizes="16*16" hreflang="en-us"> </ head > < body style="text-align:center;"> < h1 >w3wiki</ h1 > < h2 >DOM Link href Property</ h2 > < button onclick="gfg()">Get URL </ button > < p id="pid" style="font-size:25px; color:green;"> </ p > < script > function gfg() { // Setting Link href Property var NEW = document.getElementById( "linkid").href = "style3.css"; document.getElementById( "pid").innerHTML = "The value of the href attribute"+ " was changed to " + NEW; } </ script > </ body > </ html > |
Output:
Before Clicking On Button:
After Clicking On Button:
Supported Browsers:
- Google Chrome
- Mozilla Firefox
- Edge
- Safari
- Opera