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>