Tutorialspoint.dev

HTML | DOM Location href Property

The Location href property in HTML is used to set or return the complete URL of the current page. The Location href property can also be used to set the href value point to another website or point to an email address. The Location href property returns a string which contains the entire URL of the page, including the protocol.

Syntax:

  • location.href

    It returns the href property.

  • location.href = URL

    It is used to set the href property.

Below programs illustrate the Location href Property in HTML:

Example 1:

<!DOCTYPE html>
<html>
    <head
        <title>DOM Location href Property</title
        <style
            h1 { 
                color:green; 
            
            h2 {
                font-family: Impact;
            }
            body { 
                text-align:center; 
            
        </style
    </head>
    <body>
        <h1>GeeksforGeeks</h1
        <h2>DOM Location href Property</h2
        <p>For returning the entire URL current page, 
        double click the "Return URL" button: </p>
        <button ondblclick="myhref()">Return URL</button>
        <p id="href"></p>
        <script>
            function myhref() {
                var h = location.href;
                document.getElementById("href").innerHTML = h;
            }
        </script>
    </body>
</html>                    

/div>

Output:

After click on the button:



Example 2: Set the href value to point another URL of website.

<!DOCTYPE html>
<html>
    <head
        <title>DOM Location href Property</title
        <style
            h1 { 
                color:green; 
            
            h2 {
                font-family: Impact;
            }
            body { 
                text-align:center; 
            
        </style
    </head>
    <body>
        <h1>GeeksforGeeks</h1
        <h2>DOM Location href Property</h2
        <p>For redirecting to GeeksforGeeks homepage,
        double click the "Redirect" button: </p>
        <button ondblclick="myhref()">Redirect</button>
        <script>
            function myhref() {
                location.href = "https://www.geeksforgeeks.org";
            }
        </script>
    </body>
</html>                    

Output:

After click on the button:

Supported Browsers: The browser supported by Location href Property are listed below:

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


This article is attributed to GeeksforGeeks.org

You Might Also Like

leave a comment

code

0 Comments

load comments

Subscribe to Our Newsletter