HTML DOM Input Datetime 对象

htmlweb developmentfront end technology更新于 2025/6/17 2:20:17

HTML DOM Input Datetime 对象表示一个 datetime 类型的 HTML 输入元素。此外，除 Safari 外，主流浏览器仅将 datetime 类型视为文本。

语法

以下是语法 −

创建类型为 datetime 的 <input> 元素

var datetimeObject = document.createElement(“input”);
datetimeObject.type = “datetime”;

属性

此处，“datetimeObject” 可以具有以下属性 −

属性	描述
autocomplete	定义 datetime 字段 autocomplete 属性的值
autofocus	定义 datetime 字段是否在页面初始加载时获得焦点。
defaultValue	设置/返回 datetime 字段的默认值
disabled	定义 datetime 字段是否禁用/启用
form	返回/设置 datetime 字段 max 属性的值
min	返回/设置 datetime 字段 min 属性的值
name	定义 datetime 字段 name 属性的值
readOnly	定义 datetime 字段是否只读
required	定义 datetime 字段是否必须填写才能提交表单
step	定义 datetime 字段 step 属性的值
type	返回 datetime 表单元素的类型字段
value	定义日期时间字段的 value 属性值

布尔值

以及以下方法 −

booleanValue	描述
stepDown	定义日期时间字段应减少的数字。
stepUp	定义日期时间字段应增加的数字。

示例

让我们看一个 Input Datetime min 属性的示例 −

<!DOCTYPE html>
<html>
<head>
<title>Input Datetime Min</title>
</head>
<body>
<form>
Date & Time: <input type="datetime" id="dateTime" name="DateSelect" value="2009-6-24T20:49Z" min="2008-12-31T23:59:59Z">
</form>
<button onclick="minDateDecrease()">Decrease min age bar</button>
<div id="divDisplay"></div>
<script>
   var inputDatetime = document.getElementById("dateTime");
   var divDisplay = document.getElementById("divDisplay");
   divDisplay.textContent = 'Minimum Age Bar: '+inputDatetime.min;
   function minDateDecrease() {
      inputDatetime.min = '2010-12-31T23:59:59Z';
      divDisplay.textContent = 'Minimum Age Bar: '+inputDatetime.min;
   }
</script>
</body>
</html>