用原生js实现距离今年年底倒计时效果

时间:2021-08-21 23:25:14
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="UTF-8"><meta/>
<script type="text/javascript">
// 设置倒计时效果
// var time=new Date();
// 创建当前时间
window.onload=function(){
  function djs(){
  var time1=new Date();
var re1=time1.getTime();
// 创建未来的时间
var time2=new Date(2017,11,31,23,59,59);
var re2=time2.getTime();


var re=re2-re1;
var day = parseInt(re /( 1000 * 60 * 60 * 24));//转为天数
// 获得剩余的毫秒数
var re=re%( 1000 * 60 * 60 * 24)
var hour=parseInt(re/(1000 * 60 * 60 ));//转为小时数
// 获得剩余的毫秒数
var re=re%( 1000 * 60 * 60)
var minute=parseInt(re/(1000 * 60));//转为分钟数
// 获得剩余的毫秒数
var re=re%( 1000 * 60)
var second=parseInt(re/(1000));//转为秒数
// document.write("距离年底还有"+day+"天"+hour+"小时"+minute+"分钟"+second+"秒");
var ss=document.getElementById('time').getElementsByTagName('span');//把所有的标签都抓过来。
ss[0].innerHTML=day;
ss[1].innerHTML=hour;
ss[2].innerHTML=minute;
ss[3].innerHTML=second;
  }
  djs();
  // 设置定时器,每隔一秒钟走一遍。
  setInterval(djs,1000);
}
</script>
</head>
<body>
<h1 id="time">距离年底还有<span>0</span>天<span>0</span>小时<span>0</span>分钟<span>0</span>秒</h1>


</body>
</html>