javascript定时器小结

本文主要是介绍javascript定时器小结，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

javascript有两种定显示器， setTimeout和setInterval，下面简要介绍两个函数然后附上简单的例子。
setTimeout(function, time) , 当定位到time间隔则执行function函数，执行一次就不再执行

clearTimeout(t), 结束setTimeout定时器
setInterval(function, time), 每隔time间隔执行一次function函数

clearInterval(t),结束setinterval定时器
示例：

[html]  view plain copy  
 <!DOCTYPE html>  
 <html>  
     <head>  
     <meta charset="utf-8">  
     <title>JS Test</title>  
     <style type="text/css">  
         .xxm {  
                 color:green;  
                 font:size=36px;  
                 font-weight:bold;  
                 font-family:Microsoft YaHei;  
                 background-color:white  
                 background-position:top center;  
                   
         }  
     </style>  
       
     </head>  
     <body>  
         <p class="xxm">定时器</p>  
     <script type="text/javascript">  
         var c1 = 0;  
         var c2 = 0;  
         var t;   
         var t2;  
         var t3;  
         function timeCount(){  
             document.getElementById('txt').value = c1;  
             c1 = c1 + 1;  
             t = setTimeout("timeCount()", 1000); //此处实现timeCount函数每隔1s执行一次的功能         
         }  
         function stopTimeout(){  
             clearTimeout(t);  
         }  
         function timeCount2(){  
             document.getElementById('txt').value=c2;  
             c2=c2+1;  
         }  
         function interval(){  
             t2 = setInterval("timeCount2()", 1000);  
         }  
         function stop(){  
             clearInterval(t2);  
         }  
         function startTime(){  
             var today = new Date();   
             var y = today.getFullYear();  
             var mon= today.getMonth();  
             var day = today.getDate();  
             var h = today.getHours();  
             var m = today.getMinutes();  
             var s = today.getSeconds();  
             m = checkTime(m);  
             s = checkTime(s);  
             document.getElementById('txt').value = y+"-"+mon+"-"+day+" "+h+":"+m+":"+s;  
             //t3 = setTimeout('startTime()',1000);        
         }  
         function start(){  
             t3 = setInterval('startTime()',1000);         
         }  
           
         function stopTime(){  
             //clearTimeout(t3);  
             clearInterval(t3);  
         }  
         function checkTime(i){  
             if (i<10){  
                 i = "0"+i;  
             }  
             return i;  
         }  
   
     </script>  
       
     <input type="text" id="txt"/><br><br>  
     <input type="button" value="开始setTimeout事件" onclick="javascript:timeCount()"/>  
     <input type="button" value="结束setTimeout事件" onclick="javascript:stopTimeout()"/><br><br>  
     <input type="button" value="开始setInterval事件" onclick="javascript:interval()"/>  
     <input type="button" value="结束setInterval事件" onclick="javascript:stop()"/><br><br>  
     <p class="xxm">实时时钟<p/>  
     <input type="button" value="开始时间" onclick="javascript:start()"/>  
     <input type="button" value="结束时间" onclick="javascript:stopTime()"/><br><br>  
   
     </body>  
       
 </html>  