下班倒计时

    //css样式省略
    
    <body>
    <div class="countdown">
    <p class="next">今天是2021年8月28日</p>
    <p class="title">下班倒计时 <input type="datetime-local" id="des" /></p>
    <p class="clock">
      <span id="hour">00</span>
      <i>:</i>
      <span id="minutes">00</span>
      <i>:</i>
      <span id="scond">00</span>
    </p>
    <p class="tips">
      现在是18:30:00
    </p>
  </div>

  <script>
   //获取元素
    let elehour = document.querySelector('#hour')
    let eleminutes = document.querySelector('#minutes')
    let elescond = document.querySelector('#scond')

    //开启定时器
    let timeId = setInterval(function () {

      //获取下班时间的时间戳
      let date = new Date('2022-1-20 17:04:00')

      //获取当前时间戳
      let now = (Date.now())
      // let noe=+new Date()

      //获取时间差异
      let offset = parseInt(date.getTime() - now) / 1000

      //判断下班时间是否已到 如果到则停止倒计时
      if (offset === 0) {
        clearInterval(timeId)
      }

      //获取小时数
      let hour = parseInt(offset / 60 / 60 % 24)
      hour = hour < 10 ? '0' + hour : hour

      //获取分钟数
      let min = parseInt(offset / 60 % 60)
      min = min < 10 ? '0' + min : min

      //获取秒数
      let second = parseInt(offset % 60)
      second = second < 10 ? '0' + second : second

      //渲染到页面
      elehour.innerHTML = hour
      eleminutes.innerHTML = min
      elescond.innerHTML = second
    }, 1000)
  </script>
</body>
webapi，下班倒计时，js

下班倒计时
