实现效果

实现代码

const computingTime = startTime => {// 目标日期const targetDate = new Date(startTime).getTime();// 每秒更新倒计时const timer = setInterval(function() {// 当前时间const now = new Date().getTime();// 距离目标时间的毫秒数const distance = targetDate - now;// 计算剩余时间//小时const hours = Math.floor(distance / (1000 * 60 * 60));//分const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));//秒const seconds = Math.floor((distance % (1000 * 60)) / 1000);// 显示剩余时间countDown.value = `${hours}:${minutes}:${seconds} 秒`;// 如果目标时间已过，则停止计时器if (distance < 0) {clearInterval(timer);document.getElementById("countdown").innerHTML = "倒计时结束";}}, 1000); // 每秒更新一次
};

实现思路

既然是倒计时，肯定是要涉及到时间日期的操作了。js 里可以用 new Date() 来创建各种格式的时间日期。还涉及到定时器的使用。计算出当前时间和目标时间的时间差，还要对剩余时间做下处理，得出时、分、秒，然后通过重复调用，每隔 1 秒刷新一次就实现了。