Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
HTML DOM Input Search object
The HTML DOM Input Search object is associated with the <input> element with type “search”. We can create and access an input element with type search using the createElement() and getElementById() method respectively.
Properties
Following are the properties for the Input Search object −
| Property | Description |
|---|---|
| autocomplete | To set or return if the search field should get focus automatically when the page loads or not. |
| autofocus | To set or return if the search field should get focus automatically when the page loads or not. |
| defaultValue | To set or return the search field default value. |
| disabled | To set or return if the reset button has been disabled, or not. |
| form | To return the reference of the form containing the search field |
| list | To return the reference to the datalist containing the search field. |
| maxLength | To set or return the maxlength attribute value of a search field. |
| name | To set or return the name attribute value of a search field |
| pattern | To set or return pattern attribute value of a search field. |
| placeholder | To set or return the placeholder attribute value of a search field |
| readOnly | To set or return if the search field is read-only, or not |
| required | To set or return if it is mandatory to fill the search field before submitting the form or not. |
| size | To set or return size attribute value of the search field. |
| type | It is a read only property returning the type of form element the search field is. |
| value | To set or returns the value attribute value of the search field. |
Syntax
Following is the syntax for −
Creating an input search object −
var P = document.createElement("INPUT");
P.setAttribute("type", "search");Example
Let us look at an example for the Input Search object −
<!DOCTYPE html>
<html>
<head>
<script>
function createSearch() {
var S= document.createElement("INPUT");
S.setAttribute("type", "search");
document.body.appendChild(S);
}
</script>
</head>
<body>
<p>Create an input field with type search by clicking the below button</p>
<button onclick="createSearch()">CREATE</button>
<br><br>
FRUITS:
</body>
</html>Output
This will produce the following output −
On clicking the CREATE button −
Updated on: 19-Aug-2019
92 Views
Advertisements
To Continue Learning Please Login