HTML | DOM Textarea Object

The Textarea Object in HTML DOM is used to represent the HTML <textarea> Element. The textarea element can be accessed by using getElementById() method.

Syntax:

document.getElementById("ID"); 

Where ID is assigned to the <textarea> element.



Property Values:

  • autofocus: It is used to set or return whether the element should get focus when the page loads.
  • cols: It is used to set or return the value of this cols attribute of a textarea Element.
  • defaultvalue: It is used to set or return the defaultvalue of the textarea element.
  • form: It is used to return the reference of the form that contains the textarea field.
  • maxLength: It is used to set or return the value of the maxattribute of a textarea field.
  • name: It is used to set or return the name attribute of a textarea field.
  • placeholder: It is used to set or return the value of the placeholder attribute of a textarea field.
  • readOnly: It is used to return the value of the readonly attribute of a textarea field.
  • required: It is used to set or return whether the input element must be filled before submitting the form.
  • type: rows: It is used to set or return the value of the type attribute of a textareafield
  • value: It is used to set or return the content of a textarea field.
  • wrap: It is used to return the value of the wrap attribute of a textarea field.

Methods:

  • select(): It is used to select all the entire contents present in the textarea field.

Example 1: This example describes the getElementById() method to access the <textare> element.

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html> 
<html
    <head
        <title>
            HTML DOM Textarea Object
        </title
    </head
      
    <body style = "text-align:center">
               
        <h1 style = "color: green;">
            GeeksforGeeks
        </h1
          
        <h2>DOM Textarea Object</h2
  
        <!--A disabled textarea-->
        <textarea id = "myGeeks"
            GeeksForGeeks.A computer science portal for Geeks.
        </textarea
          
        <br>
          
        <button onclick = "Geeks()">
            Submit
        </button>
          
        <p id = "sudo"></p>
  
        <script>
            function Geeks() {
                var x = document.getElementById("myGeeks").value;
                document.getElementById("sudo").innerHTML = x;
            }
        </script>
    </body
</html>                    

chevron_right


Output:
Before Click on the Button:

After Click on the Button:

Example 2: Textarea Object can be created by using the document.createElement method.

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html> 
<html
    <head
        <title>
            HTML DOM Textarea Object
        </title
    </head>
      
    <body style = "text-align:center">     
      
        <h1 style = "color: green;">
            GeeksforGeeks
        </h1
          
        <h2>DOM Textarea Object</h2
          
        <button onclick = "Geeks()">
            Submit
        </button>
          
        <!-- script to create textarea -->
        <script>
            function Geeks() {
                  
                // textarea tag is created 
                var g = document.createElement("TEXTAREA");
                  
                var f = document.createTextNode(
                "GeeksForGeeks.A computer science portal for Geeks.");
                  
                g.appendChild(f);
                document.body.appendChild(g);
            }
        </script>
    </body
</html>                    

chevron_right


Output:
Before Click on the Button:

After Click on the Button:

Supported Browsers: The browser supported by DOM Textarea Object are listed below:

  • Google Chrome
  • Internet Explorer
  • Firefox
  • Opera
  • Safari


My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.



Improved By : nidhi_biet



Article Tags :
Practice Tags :


Be the First to upvote.


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.