设置三个盒子来存时——分——秒；
<div class="hour">1</div>
<div class="minute">2</div>
<div class="second">3</div>
这时候盒子呈现从上到下排列，可以在CSS中设置； 更多的样式可以根据需求去增加样式；
<style>
div{
float: left;
}
</style>
接下来的操作都在JS中完成，代码如下：
<script>
var hour = document.querySelector('.hour');//这里获取小时盒子；
var minute = document.querySelector('.minute');//这里获取分钟盒子；
var second = document.querySelector('.second');//这里获取秒钟盒子；
var inputTime = +new Date ('2022-8-29 18:00:00');//这里是获取输入的时间的时间戳；
setInterval(contentDown, 1000);//调用函数以及让函数每秒执行一次；
function contentDown () {
var nowTime = +new Date();//获取当前的时间戳；
var times = (inputTime - nowTime) / 1000;//计算得到输入时间到当前时间戳的差值；
var h = parseInt (times / 60 / 60 % 24) ;//计算当前多少小时后强制类型转换；
h = h < 10 ? '0' + h : h;
//如果时长大于10，即直接显示，如果小时余数小于10，则在前面加0；
hour.innerHTML = h ;//将小时数引入第一个盒子的文本中；
var m = parseInt (times / 60 % 60) ;计算当前多少分钟后强制类型转换；
m = m < 10 ? '0' + m : m;
//如果分钟大于10，即直接显示，如果分钟余数小于10，则在前面加0；
minute.innerHTML = m ;//将分钟数引入第二个盒子的文本中；
var s = parseInt(times % 60) ;//计算当前多少秒钟后强制类型转换；
s = s < 10 ? '0' + s : s;
//如果秒钟大于10，即直接显示，如果秒钟余数小于10，则在前面加0；
second.innerHTML = s ;//将秒钟数引入第三个盒子的文本中；
}
</script>
这样可以得到一个简易版的倒计时模型，上面的时间也可以更改成用户或者后台管理员能够进行修改的类型；
