HTML DOM Input Search 对象

htmlweb developmentfront end technology更新于 2025/9/26 10:20:17

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

属性

以下是 Input Search 对象的属性 −

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

语法

以下是语法 −

创建输入搜索对象 −

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

示例

让我们看一个输入搜索对象的示例 −

<!DOCTYPE html>
<html>
<head>
<script>
   function createSearch() {
      var S= document.createElement("INPUT");
      S.setAttribute("type", "search");
      document.body.appendChild(S);
   }
</script>
</head>
<body>
<p>Create an input field with type search by clicking the below button</p>
<button onclick="createSearch()">CREATE</button>
<br><br>
FRUITS:
</body>
</html>