I am looking to add a timer to my HTML page using JavaScript. The timer should get the selected date and time from an input field <input type="date" /> and control it. If the time difference between the current time and the selected time is less than 1 day, the timer should display an alert message. Can someone guide me on how to compare the current time with the selected time? Thank you for all the help.
function add() {
var num = document.getElementById("t1").rows.length;
console.log(num);
var x = document.createElement("tr");
var a = document.createElement("td");
var anode = document.createTextNode(num + '.');
a.appendChild(anode);
x.appendChild(a);
a = document.createElement("td");
anode = document.createElement("input");
var b = document.createAttribute("type");
b.value = "checkbox";
anode.setAttributeNode(b);
a.appendChild(anode);
x.appendChild(a);
a = document.createElement("td");
anode = document.createElement("input")
var b = document.createAttribute("type");
b.value = "date";
anode.setAttributeNode(b);
a.appendChild(anode);
x.appendChild(a);
a = document.createElement("td");
anode = document.createElement("input");
b = document.createAttribute("type");
b.value = "text";
anode.setAttributeNode(b);
a.appendChild(anode);
x.appendChild(a);
a = document.createElement("td");
anode = document.createElement('input');
anode.setAttribute('type', 'button');
anode.setAttribute('value', 'Delete Row');
anode.setAttribute('onclick', 'deleteRow(this)');
a.appendChild(anode);
x.appendChild(a);
document.getElementById("t1").appendChild(x);
}
function deleteRow(e, v) {
var tr = e.parentElement.parentElement;
var tbl = e.parentElement.parentElement.parentElement;
tbl.removeChild(tr);
}table {
border-collapse: collapse;
margin: 10px;
}
table,
td,
th {
border: 1px solid black;
padding: 10px;
}<table id="t1">
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th>
<input style="padding:10px" type="button" value="Add Row" onclick="add()" />
</th>
</tr>
<tr>
<td>1.</td>
<td>
<input type="checkbox" />
</td>
<td>
<input type="date" />
</td>
<td>
<input type="text" />
</td>
<td>
<input type="button" value="Delete Row" onclick="deleteRow(this)" />
</td>
</tr>
</table>