javascript setTimeout setInterval使用詳解
From:http://hi.baidu.com/hongz1125/blog/item/8fcc49a951f73bf61f17a202.html
setTimeOut setInterval
Internet的基本結構是建立在一系列靜態狀態上，這些靜態狀態一般都稱做頁面。從第13章可以看到，DHTML打破了這個模型，爲了響應用戶的動作，DHTML在相同的界面上創建了很多獨立的狀態。本章將就這種動態理念進行更深一步的探討。 有了Javascript，網頁就可以不再是一堆離散狀態的集合，藉助於時間（time）和動作（motion），可以創建出真正的動態頁面。對象可以隨着時間而改變，可以在頁面上順暢地運動，而且用戶還可以像在實際生活中與事物進行交互那樣對對象進行操作。目前好多操作在桌面應用程序中都已經用濫了，如拖曳對象或者滑動控件，這些都是很好的桌面應用的例子，不過這些操作現在還沒有被集成到Web中去。
在接下來的方法中，大家可以學到在頁面上移動對象所涉及的基本步驟，
然後還可以應用這些基本的知識來創建一個實時交互系統，如滑動控件和拖曳界面。
14.1 setTimeOut和setInterval的使用
這兩個方法都可以用來實現在一個固定時間段之後去執行JavaScript。
不過兩者各有各的應用場景。
方法
實際上，setTimeout和setInterval的語法相同。它們都有兩個參數，一個是將要執行的代碼字符串，還有一個是以毫秒爲單位的時間間隔，當過了那個時間段之後就將執行那段代碼。
不過這兩個函數還是有區別的，setInterval在執行完一次代碼之後，經過了那個固定的時間間隔，它還會自動重複執行代碼，而setTimeout只執行一次那段代碼。
雖然表面上看來setTimeout只能應用在on-off方式的動作上，不過可以通過創建一個函數循環重複調用setTimeout，以實現重複的操作：
File: settimeout_setinterval.js
showTime();
function showTime()
{
var today = new Date();
alter("The time is:"+today.toString());
setTimeout("showTime()", 5000);
}
一旦調用了這個函數，那麼就會每隔5秒鐘就顯示一次時間。
如果使用setInterval，則相應的代碼如下所示：
File: settimeout_setinterval2.js
setInterval("showTime()", 5000);
function showTime()
{
var today = new Date();
alert("The time is:"+today.toString());
}
這兩種方法可能看起來非常像，而且顯示的結果也會很相似，
不過兩者的最大區別就是，setTimeout方法不會每隔5秒鐘就執行一次showTime函數，它是在每次調用setTimeout後過去5秒鐘，再去執行showTime函數。這意味着如果showTime函數的主體部分需要2秒鐘執行完，那麼整個函數則要每7秒鐘才執行一次。而setInterval卻沒有被自己所調用的函數所束縛，它只是簡單地每隔一定時間就重複執行一次那個函數。
如果要求在每隔一個固定的時間間隔後就精確地執行某動作，那麼最好使用setInterval，而如果不想由於連續調用產生相互干擾的問題，尤其是每次函數的調用需要繁重的計算以及很長的處理時間，那麼最好使用setTimeout。
函數指針的使用
兩個計時函數中的第一個參數是一段代碼的字符串，其實該參數也可以是一個函數指針，不過Mac下的IE5對此不支持。（張立斌：不要讓自己的代碼刻意支持IE5）
如果用函數指針作爲setTimeout和setInterval函數的第二個參數，
那麼它們就可以去執行在另外定義的函數了：
setTimeout(showTime, 500);
function showTime()
{
var today = new Date();
alert("The time is:"+today.toString());
}
另外，匿名函數還可以聲明爲內聯函數：
（張立斌：其實，這裏只是使用匿名函數，沒有內聯）
setTimeout(function()
{
var today = new Date();
alert("The time is:"+today.toString();
},
500);
討論
如果對計時函數不加以處理，那麼setInterval將會持續執行相同的代碼，一直到瀏覽器窗口關閉，或者用戶轉到了另外一個頁面爲止。不過還是有辦法
可以終止setTimeout和setInterval函數的執行。
當setInterval調用執行完畢時，它將返回一個timer ID，將來便可以利用該值對計時器進行訪問，如果將該ID傳遞給clearInterval，便可以終止那段被
調用的過程代碼的執行了，具體實現如下：
File:settimeout_setinterval3.js(excerpt)
var intervalProcess = setInterval("alert('GOAL!')", 3000);
var stopGoalLink = document.getElementById("stopGoalLink");
attachEventListener(stopGoalLink, "click", stopGoal, false);
function stopGoal()
{
clearInterval(intervalProcess);
}
只要點擊了stopGoalLink，不管是什麼時候點，intervalProcess都會被取消掉，以後都不會在繼續反覆執行intervalProcess。如果在超時時間段內就取消setTimeout，那麼這種終止效果也可以在setTimeout身上實現，具體實現如下：
File:settimeout_setinterval4.js(excerpt)
var timeoutProcess = setTimeout("alert('GOAL!')", 3000);
var stopGoalLink = document.getElementById("stopGoalLink");
attachEventListener(stopGoalLink, "click", stopGoal, false);
function stopGoal()
{
clearTimeout(timeoutProcess);
}