全兼容系列（4）----------------------2017春节倒计时

最新推荐文章于 2025-12-04 17:20:28 发布

原创最新推荐文章于 2025-12-04 17:20:28 发布 · 445 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

html+css+js 专栏收录该内容

7 篇文章

订阅专栏

本文提供了一个使用JavaScript实现的春节倒计时示例代码。该代码通过计算从当前时间到指定春节日期之间的差值来实时显示剩余的天数、小时数、分钟数和秒数。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
window.onload=function(){
  var oS=document.getElementById('s1');

  var oDate=new Date();//定义春节的时间变量
  oDate.setFullYear(2018,1,16);//设置春节的时间节点
  oDate.setHours(0,0,0,0);
  function toDou(n){//-----------获取两位数
    return n<10?'0'+n:''+n;
  }
  function tab(){
    var oNow=new Date();//定义现在的时间变量
    var s=parseInt((oDate.getTime()-oNow.getTime())/1000);//春节的时间戳-现在的时间戳获取倒计时的时间戳
    if(s<0)//-----------------若时间戳为0则弹出倒计时结束，并弹出去
    {
      oS.innerHTML='倒计时结束';
      clearInterval(timer);
      return;
    }
     var d=parseInt(s/86400);
     s%=86400;//%=把s中能凑成整数的部分去掉，得到的新s就是余数
     var h=parseInt(s/3600);
     s%=3600;
     var m=parseInt(s/60)
     s%=60;
     oS.innerHTML=''+d+'天'+toDou(h)+'时'+toDou(m)+'分'+toDou(s)+'秒';
   }
   var timer=setInterval(tab,1000);
   tab();
}
</script>
</head>
<body>
  距离2017年春节还剩：<span id="s1"></span>
</body>
</html>