HTML | DOM Input Time value Property

Last Updated : 29 Aug, 2022

The DOM Input Time value Property in HTML DOM is used to set or return the value of the value attribute of a Time field. This value attribute is used to define the time for the Time field.
Syntax:

It return the value property.

timeObject.value

It is used to set the value property.

timeObject.value = hh:mm:ss.ms

Property Values:

hh:mm:ss.ms It is used to specify the time for the time field.
hh – It specify the hour.
mm- It specify the minutes.
ss- It specify the seconds.
ms- It specify the milliseconds.

Return Value: It returns a string value which represents the time.

Below Program illustrates the use of Time Value Property.
Example-1: This Example illustrates that how to return the Property.

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
        DOM Input Time value Property
    </title>
</head>
 
<body>
    <center>
        <h1 style="color:green;"> 
                GeeksForGeeks 
            </h1>
 
        <h2>
          DOM Input Time value Property
      </h2>
 
        <label for="uname"
               style="color:green">
            <b>
              Enter time
          </b>
        </label>
 
        <input type="time"
               id="gfg"
               placeholder="Enter time">
 
        <br>
        <br>
 
        <button type="button"
                onclick="geeks()">
            Click
        </button>
 
        <p id="GFG"
           style="font-size:24px;
                  color:green;">
      </p>
 
 
 
 
        <script>
            function geeks() {
               
                var link = 
                    document.getElementById(
                      "gfg").value;
               
                document.getElementById(
                  "GFG").innerHTML = link;
            }
        </script>
    </center>
</body>
 
</html>

Output:
Before Clicking On Button:

After Clicking On Button:

Example-2: This Example illustrates how to set the Property.

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
        DOM Input Time value Property
    </title>
</head>
 
<body>
    <center>
        <h1 style="color:green;"> 
                GeeksForGeeks 
            </h1>
 
        <h2>
          DOM Input Time value Property
      </h2>
 
        <label for="uname"
               style="color:green">
            <b>Enter time</b>
        </label>
 
        <input type="time"
               id="gfg"
               placeholder="Enter time">
 
        <br>
        <br>
        <button type="button"
                onclick="geeks()">
            Click
        </button>
 
        <p id="GFG"
           style="font-size:24px;
                  color:green'">
      </p>
 
 
 
 
        <script>
            function geeks() {
               
                var link = document.getElementById(
                  "gfg").value = "04:23:55";
               
                document.getElementById(
                  "GFG").innerHTML = 
                  "The value has changed to " + link;
            }
        </script>
    </center>
</body>
 
</html>