Open In App

HTML | DOM Input URL maxLength Property

Improve
Improve
Like Article
Like
Save
Share
Report

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 URL 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


    Last Updated : 21 Jul, 2022
    Like Article
    Save Article
    Previous
    Next
    Share your thoughts in the comments
Similar Reads