Skip to content
Related Articles

Related Articles

Improve Article
HTML | DOM Base href Property
  • Last Updated : 17 Apr, 2019

The DOM Base href Property in HTML DOM is used to set or return the value of the href attribute of a <base> element. The href attribute is used to specify the base URL for all the relative URL in the webpage.

Syntax:

  • It returns the href property.
    baseObject.href
  • It is used to set the href property.
    baseObject.href = URL

    Property Values: It contains the value i.e URL which specifies the base URL of a webpage.

    Return Value: It returns a string value which represents the base URL of the webpage including the name of the protocol.

    Example:This Example returns the href Property.






    <!DOCTYPE html>
    <html>
      
    <head>
        <base id="Geek_Base" 
              href="https://www.geeksforgeeks.org">
        <title>
            HTML | DOM Base href Property
        </title>
    </head>
      
    <body style="text-align:center;">
      
        <h1 style="color:green;"
                GeeksForGeeks 
            </h1>
      
        <h2>
          HTML | DOM Base href Property
      </h2>
      
        <button onclick="myGeeks()">
            Click
        </button>
        <h4><p id="Geek_p" 
               style="color:green;
                      font-size:24px;">
          </p>
      </h4>
      
        <script>
            function myGeeks() {
      
                // returninh the href Propertyt. 
                var x =
                    document.getElementById(
                        "Geek_Base").href;
      
                document.getElementById(
                    "Geek_p").innerHTML = x;
            }
        </script>
    </body>
      
    </html>

    Output:

    Before Clicking On Button :

    After Clicking On Button :

    Example-2 : This Example sets the href Property.




    <!DOCTYPE html>
    <html>
      
    <head>
        <base id="Geek_Base"
              href="https://www.geeksforgeeks.org">
        <title>
            HTML | DOM Base href Property
        </title>
    </head>
      
    <body style="text-align:center;">
      
        <h1 style="color:green;"
                GeeksForGeeks 
            </h1>
      
        <h2>
          HTML | DOM Base href Property
      </h2>
      
        <button onclick="myGeeks()">
            Click
        </button>
        <h4><p id="Geek_p"
               style="color:green;
                      font-size:24px;">
          </p>
      </h4>
      
        <script>
            function myGeeks() {
      
                // returninh the href Propertyt. 
                var x =
                    document.getElementById(
                    "Geek_Base").href = "https://www.finecomb.com/";
      
                document.getElementById(
                    "Geek_p").innerHTML = 
                "the value of the href attribute was changed to " + x;
            }
        </script>
    </body>
      
    </html>

    Output :
    Before Clicking On Button:

    After Clicking On Button:

    Supported Browsers: The browser supported by DOM base href property are listed below:

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



    My Personal Notes arrow_drop_up
Recommended Articles
Page :