HTML | DOM Input URL maxLength Property

Last Updated : 21 Jul, 2022

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> 