如何修改JS倒计时代码实现迈阿密时间7月13日零点时分秒倒计时

1. 隐藏天数仅显示时分秒 #

原有代码的小时计算逻辑会自动剔除天数部分，调整为将天数折算为总小时数，同时删除天数相关的输出逻辑即可。另外你自己修改的代码里缺少if语句的花括号，会导致倒计时结束后只有小时位显示过期，分钟和秒位内容不会更新，需要补充修正。

2. 设置迈阿密时区的目标日期 #

迈阿密属于美国东部时区，时区标识为America/New_York，7月处于夏令时阶段，时区偏移为UTC-4，推荐使用系统自带的时区转换方法自动适配夏令时，无需手动计算偏移量，避免出错。 #

完整修改后代码 #

<p id="demo"></p>
<script>
// 设置迈阿密时区2024年7月13日00:00:00的目标时间戳
const targetTime = new Date('2024-07-13 00:00:00').toLocaleString('en-US', {timeZone: 'America/New_York'});
const countDownDate = new Date(targetTime).getTime();
// 每秒更新倒计时
const timer = setInterval(function() {
  const now = new Date().getTime();
  const distance = countDownDate - now;
  if (distance < 0) {
    clearInterval(timer);
    document.getElementById("demo").innerHTML = "已过期";
    return;
  }
  // 计算总时分秒，无需单独计算天数
  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);
  // 补零格式化
  const format = num => num < 10 ? `0${num}` : num;
  // 输出结果
  document.getElementById("demo").innerHTML = `${format(hours)}h ${format(minutes)}m ${format(seconds)}s`;
}, 1000);
</script>

如果你需要对应三个独立DOM元素分别显示时分秒，可以把输出部分调整为如下逻辑：

if (distance < 0) {
  clearInterval(timer);
  document.getElementById("hours").innerHTML = "已过期";
  document.getElementById("minutes").innerHTML = "";
  document.getElementById("seconds").innerHTML = "";
} else {
  // 计算和格式化逻辑同上
  document.getElementById("hours").innerHTML = format(hours);
  document.getElementById("minutes").innerHTML = format(minutes);
  document.getElementById("seconds").innerHTML = format(seconds);
}

内容的提问来源于stack exchange，提问作者theovogg