封装倒计时

 效果如下图所示:

 

 完整代码如下:

html

<p class="count"></p>

 

js :

window.onload = function () {
 countDown()
 function addZero (i) {
  return i < 10 ? '0' + i : i + ''
 }
 function countDown () {
  let nowTime = new Date()
  let endTime = new Date('2021-5-20 12:12:12')
  let leftTime = parseInt((endTime.getTime() - nowTime.getTime()) / 1000)
  let d = parseInt(leftTime / (24 * 60 * 60))
  let h = parseInt(leftTime / (60 * 60) % 24)
  let m = parseInt(leftTime / 60 % 60)
  let s = parseInt(leftTime % 60)
  d = addZero(d)
  h = addZero(h)
  m = addZero(m)
  s = addZero(s)
  document.querySelector('.count').innerHTML = ` ${d} 天 ${h} : ${m} : ${s} `
  if (leftTime <= 0) {
   document.querySelector('.count').innerHTML = '直播已结束'
   return
  }
  setTimeout(countDown, 1000)
 }
}

 

 

posted @ 2021-05-27 14:46  Freya~  阅读(73)  评论(0)    收藏  举报