HTML DOM Input Text 对象

htmlweb developmentfront end technology更新于 2025/9/27 15:40:17

HTML DOM Input Text 对象与类型为"text"的 <input> 元素相关联。我们可以分别使用 createElement() 和 getElementById() 方法创建和访问文本类型的输入元素。

属性

以下是 Input Text 的属性 −

属性	描述
autocomplete	设置或返回文本字段的 autocomplete 属性值
Autofocus	设置或返回文本字段在页面加载时是否自动获得焦点。
defaultValue	设置或返回文本字段的默认值值。
Disabled	设置或返回文本字段是否已禁用。
Form	返回包含文本字段的表单的引用
maxLength	设置或返回文本字段的 maxlength 属性值。
name	设置或返回文本字段的 name 属性值
pattern	设置或返回文本字段的 pattern 属性值
placeholder	设置或返回文本字段的 placeholder 属性值
readOnly	设置或返回文本字段是否为只读。
required	设置或返回在提交表单之前是否必须填写文本字段。
size	设置或返回文本字段的 size 属性值。
type	这是一个只读属性，返回文本字段所属的表单元素类型。
value	设置或返回文本字段的 value 属性值。
list	返回对包含文本字段的数据列表的引用。

语法

以下是语法 −

创建输入文本对象 −

var P = document.createElement("INPUT");
P.setAttribute("type", "text");

示例

让我们看一个输入文本对象的示例 −

<!DOCTYPE html>
<html>
<head>
<script>
   function createText() {
      var P = document.createElement("INPUT");
      P.setAttribute("type", "text");
      document.body.appendChild(P);
   }
</script>
</head>
<body>
<h1>Text object example</h1>
<p>Create an input field with type text by clicking the below button</p>
<button onclick="createText()">CREATE</button>
<br><br>
USERNAME:
</body>
</html>