The Input Password Object in HTML DOM is used to represent an HTML input element with type=”password”. The input element with type=”password” can be accessed by using getElementById() method.
Syntax:
- It is used to access input type=”password”
document.getElementById("id");
- It is used to create type=”password” element.
document.createElement("input");
Object Properties:
Property | Description |
---|---|
type | This property is used to return which type of form element the password field is. |
value | This property is used to set or return the value of the value attribute of a password field. |
autocomplete | This property is used to set or return the value of the autocomplete attribute of a password field. |
autofocus | This property is used to set or return whether a password field should automatically get focus when the page loads. |
defaultValue | This property is used to set or return the default value of a password field. |
disabled | This property is used to set or return whether a password field is disabled or not. |
form | This property is used to return reference to the form that contains the password field. |
maxLength | This property is used to set or return the value of the maxlength attribute of a password field. |
name | This property is used to set or return the value of the name attribute of a password field. |
placeholder | This property is used to set or return the value of the placeholder attribute of a password field. |
readOnly | This property is used to set or return whether the password field is read-only or not. |
required | This property is used to set or return whether the password field must be filled out before submitting a form. |
size | This property is used to set or return the value of the value attribute of the password field. |
Input Password Object Methods:
- select(): This is used to select the content of a password field.
Example-1:
HTML
<!DOCTYPE html> < html >
< body style="text-align:center;">
< h1 style="color:green;">
GeeksForGeeks
</ h1 >
< h2 >DOM Input Password Object</ h2 > Password:
< input type="password"
id="myPsw"
value="geeks12">
< p >Click the button to get the password
of the password field.</ p >
< button onclick="myFunction()">
Click Here!
</ button >
< p id="demo"></ p >
< script >
function myFunction() {
var x =
document.getElementById(
"myPsw").value;
document.getElementById(
"demo").innerHTML = x;
}
</ script >
</ body >
</ html >
|
Output:
Before click on the button:
After click on the button:
Example-2:
HTML
<!DOCTYPE html> < html >
< body style="text-align:center;">
< h1 style="color:green;">
GeeksForGeeks
</ h1 >
< h2 >DOM Input Password Object</ h2 >
< p >Click the button to create a
Password Field.</ p >
< button onclick="myFunction()">
Click Here!
</ button >
< script >
function myFunction() {
// Creating input element.
var x = document.createElement("INPUT");
// Set type password.
x.setAttribute("type", "password");
x.setAttribute("value", "geeks12");
document.body.appendChild(x);
}
</ script >
</ body >
</ html >
|
Output:
Before click on the button:
After click on the button:
Supported Browsers:
- Google Chrome 1+
- Mozilla Firefox 1+
- Edge 12+
- Safari 1+
- Opera 2+