Textarea Object
The Textarea object represents an HTML <textarea> element.
Access a Textarea Object
You can access a <textarea> element by using getElementById():
Example(1)
Address:<br> <textarea id="myTextarea"> 342 Alvin Road XYZ</textarea> <button class="btn btn-success" type="button" onclick="myFunction()">Try it</button> <h2 id="demo"></h2> <script> function myFunction() { var x = document.getElementById("myTextarea").value; document.getElementById("demo").innerHTML = x; } </script>
In above example when you click button you can get textarea data.
Complete code for HTML DOM Textarea Object With Java Script
<!DOCTYPE html> <html> <head> <title>HTML DOM Textarea Object With Java Script</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> </head> <style> h1{ color:red; } textarea{ margin-left: 100px; } </style> <body> <div class="container"> <br> <br> <div class="text-center"> <h1>HTML DOM Textarea Object With Java Script</h1> </div> <br> <div class="well"> Address:<br> <textarea id="myTextarea" rows="5" cols="20">342 Alvin Road XYZ</textarea> <button class="btn btn-info" type="button" onclick="extract()">Get Address</button> <h2 id="demo1"></h2> <button class="btn btn-info" onclick="create_texarea()">Create it</button> </div> <div> </body> </html> <script> function extract() { var x = document.getElementById("myTextarea").value; document.getElementById("demo1").innerHTML = x; } function create_texarea() { var x = document.createElement("TEXTAREA"); var t = document.createTextNode("Visit Our BajaRangiSoft To Learn More About JAVASCRIPT"); x.appendChild(t); document.body.appendChild(x); } </script>
Textarea Object Properties
Property | Description |
---|---|
autofocus | Sets or returns whether a text area should automatically get focus when the page loads |
cols | Sets or returns the value of the cols attribute of a text area |
defaultValue | Sets or returns the default value of a text area |
disabled | Sets or returns whether the text area is disabled, or not |
form | Returns a reference to the form that contains the text area |
maxLength | Sets or returns the value of the maxlength attribute of a text area |
name | Sets or returns the value of the name attribute of a text area |
placeholder | Sets or returns the value of the placeholder attribute of a text area |
readOnly | Sets or returns whether the contents of a text area is read-only |
required | Sets or returns whether the text area must be filled out before submitting a form |
rows | Sets or returns the value of the rows attribute of a text area |
type | Returns the type of the form element the text area is |
value | Sets or returns the contents of a text area |
wrap | Sets or returns the value of the wrap attribute of a text area |
Textarea Object Methods
Method | Description |
---|---|
select() | Selects the entire contents of a text area |