webApi 获取时间和时间戳的倒计时小案列

130 阅读1分钟

image.png image.png

    // 获取元素
    let hourEle = document.querySelector('#hour')
    let minutesEle = document.querySelector('#minutes')
    let scondEle = document.querySelector('#scond')

    let timeId = setInterval(function () {
      // 1.获取下班时间离当前日期的时间戳
      // 1.1 获取下班时间的时间戳
      let date = new Date('2022-1-23 18:00:00')
      // 1.2 获取当前日期的时间戳
      let now = Date.now()
      // 1.3 获取差异
      let offset = parseInt((date.getTime() - now) / 1000) // 秒

      // 判断结束
      if (offset === 0) {
        clearInterval(timeId)
        return
      }

      // 将时间间隔转换为时分秒
      let hour = parseInt(offset / 60 / 60)
      hour = hour < 10 ? '0' + hour : hour
      let minute = parseInt((offset % 3600) / 60)
      minute = minute < 10 ? '0' + minute : minute
      let second = offset % 60
      second = second < 10 ? '0' + second : second

      // 赋值给指定的元素
      hourEle.innerHTML = hour
      minutesEle.innerHTML = minute
      scondEle.innerHTML = second
    }, 1000)
  </script>