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> GeeksforGeeks</h1>
 
    <h2>DOM Input Email placeholder Property</h2>
 
    E-mail: <input type="email" id="email" name="myGeeks"
         placeholder="careers@geeksforgeeks.org"> <BR><br>
 
    <button onclick="myGeeks()">
        Click Here!
    </button>
     
    <p id="GFG" style="font-size:20px;color:green;"></p>
     
    <!-- Script to access input element with
            type email attribute -->
    <script>
        function myGeeks() {
        <!--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> GeeksforGeeks</h1>
 
    <h2>DOM Input Email placeholder Property</h2>
 
    E-mail: <input type="email" id="email" name="myGeeks"
         placeholder="careers@geeksforgeeks.org"> <BR><br>
 
    <button onclick="myGeeks()">
        Click Here!
    </button>
     
    <p id="GFG" style="font-size:20px;color:green;"></p>
     
    <!-- Script to access input element with
            type email attribute -->
    <script>
        function myGeeks() {
        <!--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>                    