HTML | DOM 输入日期时间本地对象

Input DatetimeLocal 对象用于表示type=”datetime-local”的 HTML 元素。
Input DatetimeLocal 对象是 HTML5 中的一个新对象。

句法：

• 创建类型为 =”datetime-local”的 元素：

  gfg = document.createElement("input") 
  gfg.setAttribute("type", "datetime-local");
  

• 要访问类型为 =”datetime-local”的 元素：

  document.getElementById("datetimeLocal_object")

属性值：

Value	Description
autocomplete	It is used for setting or returning the value of the autocomplete attribute of a datetime field.
autofocus	It is used for setting or returning whether a datetime field should automatically get focus when the page loads.
defaultValue	It is used for setting or returning the default value of a datetime field.
disabled	It is used for setting or returning whether a datetime field is disabled, or not.
form	It is used for returning a reference to the form that contains the datetime field.
list	It is used for returning a reference to the datalist that contains the datetime field.
max	It is used for setting or returning the value of the max attribute of the datetime field.
min	Sets or returns the value of the min attribute of the datetime field.
name	It is used for setting or returning the value of the name attribute of a datetime field.
readOnly	It is used for setting or returning whether the datetime field is read-only, or not.
required	It is used for setting or returning whether the datetime field must be filled out before submitting a form.
step	It is used for setting or returning the value of the step attribute of the datetime field.
type	It is used for returning which type of form element the datetime field is.
value	It is used for setting or returning the value of the value attribute of a datetime field.

输入日期时间本地对象方法：

• stepDown() ：用于将日期时间字段的值递减指定的数字。
• stepUp() ：用于将日期时间字段的值增加指定的数字。

下面的程序说明了日期时间对象：
示例 1：创建一个类型为 =”datetime-local” 的 元素。

  

    Input DatetimeLocal Object
    
        h1 {
            color: green;
        }
          
        h2 {
            font-family: Impact;
        }
          
        body {
            text-align: center;
        }
    

  

  
    GeeksforGeeks
    Input DatetimeLocal Object
  
    Double Click the "Create" button to 
      create a DatetimeLocal field.
  
    
      Create
  
  
    
        function Create() {
            
            //  Create input element type "datetime-local"
            var c = document.createElement("INPUT");
            c.setAttribute("type", "datetime-local");
            c.setAttribute("value", "2019-07-02T25:32Z");
            document.body.appendChild(c);
        }
    
  

  

输出：
点击按钮前：

点击按钮后：

示例 2：访问类型为 =“datetime-local”的 元素。

  

    Input Datetime Object
    
        h1 {
            color: green;
        }
          
        h2 {
            font-family: Impact;
        }
          
        body {
            text-align: center;
        }
    

  

  
    GeeksforGeeks
    Input Datetime Object
  
    
  
    Double Click the "Access" 
      button to access a Datetime field.
  
    Access
  
    
  
    
        function Access() {
            
            // Accessing input element type value
            var a = document.getElementById(
              "test").value;
            
            document.getElementById(
              "check").innerHTML = a;
        }
    
  

  

输出：
点击按钮前：

点击按钮后：

支持的浏览器：

• 歌剧
• 谷歌浏览器
• 苹果Safari