HTML DOM 输入复选框 type 属性

htmlweb developmentfront end technology更新于 2025/8/2 16:44:17

输入复选框 type 属性返回/设置输入复选框的类型。

语法

以下是语法 −

返回字符串值

inputCheckboxObject.type

将 type 设置为字符串值

inputCheckboxObject.type = stringValue

字符串值

此处，"stringValue"可以是以下形式 -

stringValue	详情
checkbox	定义输入类型为复选框
radio	定义输入类型为单选按钮
text	定义输入类型为文本

示例

让我们看一个 输入复选框类型 属性的示例 −

<!DOCTYPE html>
<html>
<head>
<title>Type Attribute of Checkbox</title>
</head>
<body>
<form id="Form">
<div>
Other: <input id="formCheckbox" type="checkbox" name="formCheckbox">
</div>
</form>
<button onclick="changeType()">Change type of input</button>
<div id="displayDiv"></div>
<script>
   var typeOfInput = document.getElementById("formCheckbox");
   var displayDiv = document.getElementById("displayDiv");
   displayDiv.textContent = 'Type of Input: ' + typeOfInput.type function changeType(){
      if(typeOfInput.type == 'checkbox'){
         typeOfInput.type = 'text' displayDiv.textContent = 'Type of Input: ' + typeOfInput.type
      }
   }
</script>
</body>
</html>