给一个div innerhtml 后 没有内容显示的问题_实战：仅用18行JavaScript构建一个倒数计时器...

有时候，你会需要构建一个JavaScript倒计时时钟。你可能会有一个活动、一个销售、一个促销或一个游戏。你可以用原生的JavaScript构建一个时钟，而不是去找一个插件。尽管有很多很棒的时钟插件，但是使用原生JavaScript可以带来以下好处：

• 你的代码将是轻量级的，因为它将具有零依赖性。
• 你的网站将表现得更好。你不需要加载外部脚本和样式表。
• 你将拥有更多的控制权。你将会建立一个完全按照你的意愿来表现的时钟。

所以，废话不多说，下面是如何在短短的18行JavaScript中制作自己的倒计时钟。

0.演示和代码

本示例代码和演示地址：https://coding.zhangbing.site

1.基本时钟：倒数到特定的日期或时间

以下是创建基本时钟所需步骤的简要概述：

• 设置有效的结束日期。
• 计算剩余时间。
• 将时间转换为可用格式。
• 将时钟数据输出为可重复使用的对象。
• 在页面上显示时钟，并在时钟为零时停止时钟。

2.设置有效的结束日期

首先，你需要设置一个有效的结束日期。这应该是JavaScript的 Date.parse() 方法可以理解的任何格式的字符串。例如：

ISO 8601格式：

const deadline = '2015-12-31';

简短格式：

const deadline = '31/12/2015';

或者，长格式：

const deadline = 'December 31 2015';

这些格式中的每一种都允许你指定一个准确的时间和一个时区（或者在ISO日期的情况下指定一个与UTC的偏移）。例如：

const deadline = 'December 31 2015 23:59:59 GMT+0200';

3.计算剩余时间

下一步是计算剩余时间。我们需要编写一个函数，该函数需要一个表示给定结束时间的字符串（如上所述）。然后，我们计算该时间与当前时间之间的时差。看起来像这样：

function getTimeRemaining(endtime){
  const total = Date.parse(endtime) - Date.parse(new Date());
  const seconds = Math.floor( (total/1000) % 60 );
  const minutes = Math.floor( (total/1000/60) % 60 );
  const hours = Math.floor( (total/(1000*60*60)) % 24 );
  const days = Math.floor( total/(1000*60*60*24) );

  return {
    total,
    days,
    hours,
    minutes,
    seconds
  };
}

首先，我们要创建一个变量 total 以保留到截止日期为止的剩余时间。Date.parse()