Skip to content
Related Articles

Related Articles

HTML | DOM Input URL maxLength Property
  • Difficulty Level : Basic
  • Last Updated : 17 Oct, 2019

The DOM Input URL maxLength Property in HTML DOM is used to set or return the value of maxlength attribute of a URL Input Field. It specifies the maximum number of characters that have been allowed in the URL field. The default value of Input search maxLength property is 524288.

Syntax:

  • It returns the Input url maxLength property.
    urlObject.maxLength
  • It is used to set the Input url maxLength property.
    urlObject.maxLength = number

    Property Values: It contains a single value number which is used to specify the maximum number of characters that are allowed in the search maxlength Field.

    Return Value: It returns a numeric value which represents the maximum number of character that has been allowed in the URL maxlength field.

    Example-1: This example illustrates how to return the Input URL maxLength property.






    <!DOCTYPE html>
    <html>
      
    <head>
        <title>
            DOM Input URL maxLength Property
        </title>
    </head>
      
    <body>
        <center>
            <h1 style="color:green;"
                    GeeksForGeeks 
                </h1>
      
            <h2>
              DOM Input URL maxLength Property
          </h2>
      
            <label for="uname" 
                   style="color:green">
                <b>Enter URL</b>
          </label>
      
                <input type="url"
                       id="gfg"
                       placeholder="Enter URL"
                       size="20"
                       pattern="https?://.+" 
                       title="Include http://" 
                       maxlength="20">
      
                <br>
                <br>
      
                <button type="button" 
                        onclick="geeks()">
                    Click
                </button>
      
                <p id="GFG" 
                   style="color:green;
                          font-size:25px;">
              </p>
      
                <script>
                    function geeks() { 
                         
                      var link = 
                         document.getElementById(
                           "gfg").maxLength;
                        
                        document.getElementById(
                          "GFG").innerHTML = link;
                    }
                </script>
        </center>
    </body>
      
    </html>

    Output:
    Before Clicking On Button:

    After Clicking On Button:

    Example-2: This Example illustrates how to set the Property.




    <!DOCTYPE html>
    <html>
      
    <head>
        <title>
            DOM Input URL maxLength Property
        </title>
    </head>
      
    <body>
        <center>
            <h1 style="color:green;"
                    GeeksForGeeks 
                </h1>
      
            <h2>
              DOM Input URL maxLength Property
          </h2>
      
            <label for="uname" 
                   style="color:green">
                <b>Enter URL</b>
          </label>
      
                <input type="url"
                       id="gfg" 
                       placeholder="Enter URL" 
                       size="20" 
                       pattern="https?://.+" 
                       title="Include http://"
                       maxlength="20">
      
                <br>
                <br>
      
                <button type="button" 
                        onclick="geeks()">
                    Click
                </button>
      
                <p id="GFG" 
                   style="color:green;
                          font-size:25px;">
          </p>
      
                <script>
                    function geeks() {
                        
                         
                      var link = 
                          document.getElementById(
                            "gfg").maxLength = "40";
                          
                      document.getElementById(
                        "GFG").innerHTML = 
                        "The value of the maxLength"+
                        " attribute was changed to " + link;
                    }
                </script>
        </center>
    </body>
      
    </html>

    Output:
    Before Clicking On Button:

    After Clicking On Button:

    Supported Browsers: The browser supported by DOM input URL maxLength property are listed below:

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

    full-stack-img

    My Personal Notes arrow_drop_up
Recommended Articles
Page :