<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
span{
width: 25px;
height: 25px;
background-color: #303330;
font-size: 14px;
color: #fff;
padding: 4px;
}
</style>
</head>
<body>
<script>
window.addEventListener('load',function(){
var day = document.querySelector('.day')
var hour = document.querySelector('.hour')
var minute = document.querySelector('.minute')
var second = document.querySelector('.second')
var inserttime = prompt("请输入结束时间,以2022-01-05 20:00:00的形式来输入")
var inputtime = +new Date(inserttime)
function getTimer(){
var nowtime = +new Date()
var nowtime = +new Date()
var resttimeseconds = (inputtime - nowtime) / 1000
var days = parseInt(resttimeseconds/60/60/24)
days = days < 10 ? '0' + days : days
var hours = parseInt(resttimeseconds/60/60%60)
hours = hours < 10 ? '0' + hours : hours
var minutes = parseInt(resttimeseconds/60%60)
minutes = minutes < 10 ? '0' + minutes : minutes
var seconds = parseInt(resttimeseconds%60)
seconds = seconds < 10 ? '0' + seconds : seconds
day.innerText = days+'天'
hour.innerText = hours
minute.innerText = minutes
second.innerText = seconds
}
getTimer()
setInterval(getTimer,1000)
})
</script>
<div>
<span class="day"></span>
<span class="hour"></span>
<span class="minute"></span>
<span class="second"></span>
</div>
</body>
</html>