The HTML DOM Input Search size property is used for setting or returning the input search field size attribute value. It is used for defining the search field width in terms of characters. The default width is of 20 characters.
Syntax
Following is the syntax for −
Setting the Search size property −
searchObject.size = number
Here, number represents the search field width in characters. The default width is 20 characters.
Example
Let us look at an example for the Input search size property −
<!DOCTYPE html>
<html>
<body>
<h1>Input search size property</h1>
<form>
FRUITS: <input type="search" id="SEARCH1" name="fruits">
</form>
<p>Change the Search field width by clicking the below button</p>
<button onclick="changeSize()">CHANGE</button>
<p id="Sample">
<script>
function changeSize() {
document.getElementById("SEARCH1").size+=20;
var s=document.getElementById("SEARCH1").size;
document.getElementById("Sample").innerHTML="The search field width is now "+ s;
}
</script>
</body>
</html>Output
This will produce the following output −
On clicking the CHANGE button −
