HTML DOM Textarea value Property

Last Updated : 22 Jul, 2022

The Textarea value Property in HTML DOM is used to set or return the whole content inside the Textarea Box. It is used to get and change the value of the value attribute of the <Textarea> element.

Note: The value of a text area is the text between the <textarea> and </textarea> tags.

Syntax

It returns the value property:

textareaObject.value

It is used to set the value property:

textareaObject.value = text

Property Values: It contains the single value i.e text which defines the value of the Textarea field.

Example 1: Below HTML code used to returns the content of the Textarea element.

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>
        DOM Textarea value Property
    </title>
    <style>
        body {
            text-align: center;
        }
 
        h1,
        h2 {
            text-align: center;
        }
    </style>
</head>
 
<body>
    <h1 style="color: green;">
        GeeksforGeeks
    </h1>
 
    <h2>
        DOM Textarea value Property
    </h2>
 
    <textarea id="GFG" name="GFG_text">
      GeeksForGeeks    
    </textarea>
 
    <br>
    <br>
    <button type="button" onclick="myGeeks()">
        Return value Property
    </button>
    <p id="sudo" style="font-size:30px"> </p>
 
 
 
    <script>
        function myGeeks() {
            var GFG = document.getElementById("GFG").value;
            document.getElementById("sudo").innerHTML = GFG;
 
        }
    </script>
</body>
 
</html>

Output

HTML DOM Textarea value Property

Example 2: Below HTML code sets the content of the Textarea Tag.

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>
        DOM Textarea value Property
    </title>
    <style>
        body {
            text-align: center;
        }
 
        h1,
        h2 {
            text-align: center;
        }
    </style>
</head>
 
<body>
    <h1 style="color: green;">
        GeeksforGeeks
    </h1>
 
    <h2>
        DOM Textarea value Property
    </h2>
 
    <textarea id="GFG" name="GFG_text">
      GeeksForGeeks    
    </textarea>
 
    <br>
    <br>
    <button type="button" onclick="myGeeks()">
        Set value Property
    </button>
    <p id="sudo" style="font-size:30px"> </p>
 
 
 
    <script>
        function myGeeks() {
            var GFG = document.getElementById("GFG").value
                = "Hello GeeksForGeeks . ";
            document.getElementById("sudo").innerHTML
                = "The value was changed to " + GFG;
        }
    </script>
</body>
 
</html>