HTML | DOM Input Email Placeholder Property
The DOM Input Email Placeholder Property is used to set or return the value of a placeholder attribute of an Email Field. The placeholder attribute specifies a short hint that describes the expected value of a input field / textarea. The short hint is displayed in the field before the user enters a value.
Syntax:
- It is used to return the placeholder property.
emailObject.placeholder
- It is used to set the placeholder property.
emailObject.placeholder = text
Property Value:
- text: It defines a short hint that describes a expected value of the Email Field.
Return Value: It returns a string value which represents a short hint that describes the expected value of the Email Field.
Example-1: This example illustrates how to return the property.
html
<!DOCTYPE html> < html > < head > < title > HTML DOM Input Email placeholder Property </ title > </ head > < body STYLE="TEXT-ALIGN:CENTER;"> < h1 > w3wiki</ h1 > < h2 >DOM Input Email placeholder Property</ h2 > E-mail: < input type="email" id="email" name="myBeginner" placeholder="careers@w3wiki.net"> < BR >< br > < button onclick="myBeginner()"> Click Here! </ button > < p id="GFG" style="font-size:20px;color:green;"></ p > <!-- Script to access input element with type email attribute --> < script > function myBeginner() { <!--return the placeholder Property --> var em = document.getElementById("email").placeholder; document.getElementById("GFG").innerHTML = em; } </ script > </ body > </ html > |
Output:
Before clicking on the button:
After clicking on the button:
Example-2: This example illustrates how to set the property.
html
<!DOCTYPE html> < html > < head > < title > HTML DOM Input Email placeholder Property </ title > </ head > < body STYLE="TEXT-ALIGN:CENTER;"> < h1 > w3wiki</ h1 > < h2 >DOM Input Email placeholder Property</ h2 > E-mail: < input type="email" id="email" name="myBeginner" placeholder="careers@w3wiki.net"> < BR >< br > < button onclick="myBeginner()"> Click Here! </ button > < p id="GFG" style="font-size:20px;color:green;"></ p > <!-- Script to access input element with type email attribute --> < script > function myBeginner() { <!--setting the placeholder Property --> var em = document.getElementById("email").placeholder = "Input Your Email Address"; document.getElementById("GFG").innerHTML = "The value of the placeholder attribute was changed to :" + em; } </ script > </ body > </ html > |
Output:
Before clicking on the button:
After clicking on the button:
Supported Browsers: The browser supported by DOM input Email placeholder Property are listed below:
- Google Chrome 5
- Edge 12
- Firefox
- Opera 11
- Safari