Skip to content
Related Articles

Related Articles

HTML DOM Input Tel placeholder Property

Improve Article
Save Article
  • Last Updated : 29 Aug, 2022
Improve Article
Save Article

The input tel placeholder property in HTML DOM is used to set or return the value of the placeholder attribute of an input tel field. The placeholder attribute specifies the 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 returns the input tel placeholder property. 

telObject.placeholder

It is used to set the Input tel placeholder property. 

telObject.placeholder = text

Property Value: It contains single value text which is used to define a short hint that describes an expected value of the tel field.

Return Value: It returns a string value that represents a short hint that describes the expected value of the tel field.

Example 1: This example illustrates how to return the input tel placeholder property.

HTML




<!DOCTYPE html>
<html>
<body style="text-align:center;">
    <h1 style="color: green;">
        GeeksforGeeks
    </h1>
    <h2>DOM Input Tel placeholder property</h2>
    <form id="formID">
        <input type="tel" id="mytel"
            placeholder="Enter your PhoneNumber"
            autofocus />
    </form>
    <br /><br />
    <button onclick="btnclick()">
        Return!
    </button>
    <p id="paraID" style="font-size:20px;"></p>
 
    <script>
        function btnclick() {
            var x = document.getElementById("mytel").placeholder;
            document.getElementById("paraID").innerHTML = x;
        }
    </script>
</body>
</html>


Output:

 

Example 2: Below HTML code illustrates how to set the input tel placeholder property. 

HTML




<!DOCTYPE html>
<html>
<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
    <h2>DOM Input Tel placeholder Property</h2>
    <form id="formID">
        <input type="tel" id="mytel"
            placeholder="Enter your PhoneNumber"
            autofocus />
    </form>
    <br /><br />
    <button onclick="btnclick()">
        Set!
    </button>
    <p id="paraID" style="font-size:20px;"></p>
 
    <script>
        function btnclick() {
            var x = document.getElementById("mytel")
                .placeholder = "Telephone number";
                 
            document.getElementById("paraID").innerHTML = x;
        }
    </script>
</body>
</html>


Output: 

 

Supported Browsers: 

  • Google Chrome 3 and above
  • Edge 12 and above
  • Firefox
  • Opera 11 and above
  • Safari 4 and above

My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!