HTML | DOM Input Password placeholder Property
The DOM Input Password Placeholder Property is used to set or return the value of the Placeholder attribute of a Password Field. The placeholder attribute specifies a short hint that describes the expected value of an input field . The short hint is displayed in the field before the user enters a value.
Syntax:
- It is used to return the placeholder property.
passwordObject.placeholder
- It is used to set the placeholder property.
passwordObject.placeholder = text
Property Value:
- text: It defines a short hint that describe a expected value of the Password Field.
Return Value: It returns a String value which represented a short hint that describes the expected value of the Password Field.
Example-1: This Example illustrates how to return the property.
HTML
<!DOCTYPE html> < html > < body style="text-align:center;"> < h1 style="color:green;"> w3wiki </ h1 > < h2 >DOM Input Password placeholder Property</ h2 > < form id="myBeginner"> Password: < input type="password" id="myPsw" name="Beginner" placeholder="password"> </ form > < br >< br > < button onclick="myFunction()"> Click Here! </ button > < p id="demo" style="color:green;font-size:25px;"></ p > < script > function myFunction() { var x = document.getElementById( "myPsw").placeholder; document.getElementById( "demo").innerHTML = x; } </ script > </ body > </ html > |
Output:
Before clicking on the button:
After clicking on the button:
Example-2: This example illustrates that how to set the property.
HTML
<!DOCTYPE html> < html > < body style="text-align:center;"> < h1 style="color:green;"> w3wiki </ h1 > < h2 >DOM Input Password placeholder Property</ h2 > < form id="myBeginner"> Password: < input type="password" id="myPsw" name="Beginner" placeholder="password"> </ form > < br >< br > < button onclick="myFunction()"> Click Here! </ button > < p id="demo" style="color:green;font-size:25px;"></ p > < script > function myFunction() { var x = document.getElementById( "myPsw").placeholder ="Enter Your Password"; document.getElementById( "demo").innerHTML = x; } </ script > </ body > </ html > |
Output:
Before clicking on the button:
After clicking on the button:
Supported Browsers: The browser supported by DOM input Password placeholder Property are listed below:
- Google Chrome 1+
- Edge 12+
- Firefox 1+
- Opera 2+
- Safari 1+