HTML | DOM Textarea placeholder Property

Last Updated : 15 Apr, 2019

The DOM Textarea placeHolder Property is used to set or return the value of the placeholder attribute of a textarea field. It specifies a short hint that describes the expected value of an input field / textarea. A short message or hint displayed before entering value in textarea.

Syntax:

It is used to Return the placeholder property.
```
textareaObject.placeholder
```
It is used to Set the placeholder property.
```
textareaObject.placeholder = text
```

Property Values:

text: It display a message / short-hint that describes the expected value of a input.

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

Example-1: This example illustrates how to set the textarea placeholder Property.

<!DOCTYPE html> 
<html> 
  
<body> 
    <center> 
        <h1 style="font-size:25px; 
                   font-style:italic;"> 
          GeeksForGeeks 
      </h1> 
        
        <h2 style="font-size:25px; 
                   font-style:italic;"> 
          DOM Placeholder Textarea Property 
      </h2> 
      Give your Intro: 
        
      <textarea id="GFG" 
                rows="4"
                cols="40"
                placeholder="Write something here"
                " about yourself..."> 
      </textarea> 
      <br> 
      <br> 
        
      <button onclick="myGeeks()">Submit</button> 
  
        <script> 
            function myGeeks() { 
                
                // Set hint for input field. 
                document.getElementById( 
                  "GFG").placeholder =  
                  "What is your Name?"; 
            } 
        </script> 
    </center> 
  
</body> 
  
</html> 

Output:

Before Clicking On Button:
After Clicking On Button:

Example-2: This example illustrates how to return the textarea placeholder property.

<!DOCTYPE html> 
<html> 
  
<body> 
    <center> 
        <h1 style="font-size:25px; 
                   font-style:italic;"> 
          GeeksForGeeks 
      </h1> 
        
        <h2 style="font-size:25px; 
                   font-style:italic;"> 
          DOM Placeholder Textarea Property 
      </h2>  
      Give your Intro: 
        <textarea id="GFG"
                  rows="4" 
                  cols="40"
                  placeholder= 
                  "Write something here  
                   about yourself..."> 
      </textarea> 
        <br> 
        <br> 
        
        <button onclick="myGeeks()"> 
          Submit 
      </button> 
        
        <p id="sudo"></p> 
        
        <script> 
            function myGeeks() { 
                
                // Short hint in input field. 
                var x = document.getElementById( 
                  "GFG").placeholder; 
                
                document.getElementById( 
                  "sudo").innerHTML = x; 
            } 
        </script> 
</body> 
  
</html> 