js定时器 倒时器

Posted verayangnakiss

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js定时器 倒时器相关的知识,希望对你有一定的参考价值。

setInterval(“fun()”,1000)    

setInterval(fun, 1000);每隔1秒钟,就去执行一次 fun 这个函数(最常用)

setInterval( function(){} , 1000 ) 

setInterval(fun(),1000)  错误的 

技术分享图片

倒计时:<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
  <style type="text/css">
   *{
    margin: 0;
    padding: 0;
   }
   #box{
    width: 100%;
    height: 50px;
    margin: 0 auto;
    background-color: lightpink;
   }
   #txt{
    line-height: 50px;
    text-align: center;
    font-size: 30px;
    color: deeppink;
    font-family: "微软雅黑";
   }
  </style>
  <script>
   window.onload = function(){
   var box = document.getElementById(‘box‘);
   var txt = document.getElementById(‘txt‘);
   setInterval(fun,1000);
   function fun(){
    var date = new Date();
    var wuyi = new Date(‘2018/5/1 00:00:00‘);
    var second =parseInt((wuyi.getTime()-date.getTime())/1000);
    var day =parseInt(second/3600/24) ;
    var h = parseInt(second/3600%24);
    var min =parseInt(second/60%60);
    var s= parseInt(second%60);
    day<10?‘0‘+day:day;
    h<10?h=‘0‘+h:h;
       min<10?min=‘0‘+min:min;
       s<10?s=‘0‘+s:s;
    txt.innerHTML = ‘距离五一还有‘+day+‘天‘+h+‘小时‘+min+‘分‘+s+‘秒‘;
   }
  }
  </script>
 </head>
 <body>
  <div id="box">
   <p id="txt"></p>
  </div>
 </body>
</html>




















































以上是关于js定时器 倒时器的主要内容,如果未能解决你的问题,请参考以下文章

模仿CountDownLatch类自定义倒时计时器

stm32的systick原理与应用

STM32 的系统滴答定时器( Systick) 彻底研究解读

Systick定时器详解

系统定时器(滴答定时器)

systick运用