HTML DOM Textarea 对象
HTML DOM Textarea 对象
在HTML DOM中，Textarea对象代表HTML表单中的文本输入区域，并允许用户输入多行文本。
Textarea对象具有一些属性和方法，使其可以通过JavaScript动态地操纵文本输入区域以实现交互性和功能性。这篇技术文档将介绍Textarea对象的基本API。
属性
文本输入区域的行数和列数
要设置文本输入区域的行数和列数，可以通过以下代码进行设置：
document.getElementById("myTextarea").rows = 10;
document.getElementById("myTextarea").cols = 50;
值
文本输入区域的值可以通过value属性设置或获取：
document.getElementById("myTextarea").value = "你好";
console.log(document.getElementById("myTextarea").value); // 输出 "你好"
禁用
通过设置disabled属性可以禁用文本输入区域：
document.getElementById("myTextarea").disabled = true;
只读
通过设置readOnly属性可以设置文本输入区域为只读：
document.getElementById("myTextarea").readOnly = true;
自动聚焦
通过设置autofocus属性可以使文本输入区域在页面加载时自动聚焦：
document.getElementById("myTextarea").autofocus = true;
方法
选取文本
已选取的文本可以通过逐个字符访问。
var myTextarea = document.getElementById("myTextarea");
myTextarea.value = "This is a textarea.";
myTextarea.selectionStart = 5;
myTextarea.selectionEnd = 7;
console.log(myTextarea.value.substring(myTextarea.selectionStart, myTextarea.selectionEnd));
//输出 "is"
滚动
通过scrollTop和scrollLeft属性可以滚动文本输入区域：
document.getElementById("myTextarea").scrollTop = 100;
document.getElementById("myTextarea").scrollLeft = 50;
插入文本
var myTextarea = document.getElementById("myTextarea");
var myText = "textarea.";
myTextarea.value = myText;
选中文本
var myTextarea = document.getElementById("myTextarea");
myTextarea.value = "This is a textarea.";
myTextarea.select();
事件
Textarea对象支持多个事件，如onchange, onfocus, onblur, onkeypress, onkeyup, onkeydown等事件。这些事件可以用于动态地从用户输入更新文本输入区域，或与其他DOM元素交互。
var myTextarea = document.getElementById("myTextarea");
myTextarea.addEventListener("change", function() {
alert("文本已更改");
});
结论
Textarea对象是HTML表单中的一部分，允许用户输入多行文本。它有许多属性和方法，允许开发者访问、更新和处理文本输入区域中的文本和数据。
Textarea事件可以用于动态地更新文本输入区域，并允许开发者与其他DOM元素进行交互。掌握Textarea对象的API，将对开发者实现交互性或功能性提供有力支持。