setTimeout 和 setInterval区别

setTimeout和setIntelval都有定时的功能!!!取消定时功能的时候都有对应的clearTimeout以及clearInterval与之对应。

但是他们之间是有区别的!

setTimeout指的是:间隔一段时间后执行,只执行一次

setInterval是指:每隔一段时间执行,执行多次

setInterval

 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 2 <HTML>
 3 <HEAD>
 4 <TITLE> New Document </TITLE>
 5 <META NAME="Generator" CONTENT="EditPlus">
 6 <META NAME="Author" CONTENT="">
 7 <META NAME="Keywords" CONTENT="">
 8 <META NAME="Description" CONTENT="">
 9 </HEAD>
10 
11 <BODY>
12 <div id="time"></div>
13 <SCRIPT LANGUAGE="JavaScript">
14 <!--
15 var timeid;
16 function setTime(){
17    var date=new Date();
18    var h=date.getHours();
19    var m=date.getMinutes();
20    var s=date.getSeconds();
21    document.getElementById("time").innerHTML=h+":"+m+":"+s;
22 }
23 timeid=setInterval("setTime()",1000);//他的调用在外部调用,而不是递归调用,表示每隔1s调用一次
24 function stop(){
25    clearInterval(timeid);
26 }
27 //-->
28 </SCRIPT>
29 <input type="button" value="暂停" onclick="stop()">
30 <input type="button" value="开始" onclick="timeid=setInterval('setTime()',1000);">
31 </BODY>
32 </HTML>

 

setTimeout

 

 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 2 <HTML>
 3 <HEAD>
 4 <TITLE> New Document </TITLE>
 5 <META NAME="Generator" CONTENT="EditPlus">
 6 <META NAME="Author" CONTENT="">
 7 <META NAME="Keywords" CONTENT="">
 8 <META NAME="Description" CONTENT="">
 9 </HEAD>
10 
11 <BODY>
12 <div id="time"></div>
13 <SCRIPT LANGUAGE="JavaScript">
14 <!--
15 var timeid;
16 function setTime(){
17    var date=new Date();
18    var h=date.getHours();
19    var m=date.getMinutes();
20    var s=date.getSeconds();
21    document.getElementById("time").innerHTML=h+":"+m+":"+s;
22    timeid=setTimeout("setTime()",1000);//递归调用,表示1s后执行一次
23 }
24 setTime();//页面加载后开始执行
25 function stop(){
26    clearTimeout(timeid);
27 }
28 //-->
29 </SCRIPT>
30 <input type="button" value="暂停" onclick="stop()">
31 <input type="button" value="开始" onclick="timeid=setInterval('setTime()',1000);">
32 </BODY>
33 </HTML>

 

 

 

posted @ 2013-10-25 16:12  qiaoyz  阅读(410)  评论(1编辑  收藏  举报