JavaScript实现倒计时（附完整源码）

最新推荐文章于 2025-05-29 14:47:07 发布

源代码大师

最新推荐文章于 2025-05-29 14:47:07 发布

阅读量1.2k

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript实战教程文章标签： javascript 开发语言 ecmascript

不予转载，严禁转载，违者必纠。

本文链接：https://blog.youkuaiyun.com/it_xiangqiang/article/details/133973929

JavaScript实战教程专栏收录该内容

950 篇文章 ¥29.90 ¥99.00

订阅专栏

超级会员免费看

本文介绍了如何使用JavaScript实现倒计时功能。通过定义目标时间并编写updateCountdown函数，计算当前时间与目标时间的差值，实时更新剩余的天、时、分、秒。当时间到达目标时间时，显示"倒计时结束！"。每秒通过setInterval函数刷新倒计时显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JavaScript实现倒计时

以下是一个简单的 JavaScript 倒计时代码实现：

// 目标时间
var targetTime = new Date('2022/01/01 00:00:00').getTime();

// 更新倒计时函数
function updateCountdown() {
  // 当前时间
  var currentTime = new Date().getTime();
  // 相差时间（单位：毫秒）
  var timeDifference = targetTime - currentTime;

  // 判断是否到达目标时间
  if (timeDifference <= 0) {
    document.getElementById('countdown').innerHTML = '倒计时结束！';
    // 清除计时器
    clearInterval(countdownInterval);
    return;
  }

  // 计算剩余天、时、分、秒
  var days = Math.floor(timeDifference / (1000 * 60 * 60 * 24));
  var hours = Math.floor((timeDifference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((timeDifference % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((timeDifference % (1000 * 60)) / 1000);

  // 显示剩余时间
  document.getElementById('countdown