Internet的基本結(jié)構(gòu)是建立在一系列靜態(tài)狀態(tài)上的，這些靜態(tài)狀態(tài)一般都稱做頁面。從第13章可以看到，DHTML打破了這個(gè)模型，為了響應(yīng)用戶的動作，DHTML在相同的界面上創(chuàng)建了很多獨(dú)立的狀態(tài)。本章將就這種動態(tài)理念進(jìn)行更深一步的探討。
有了JavaScript，網(wǎng)頁就可以不再是一堆離散狀態(tài)的集合，借助于時(shí)間（time）和動作（motion），可以創(chuàng)建出真正的動態(tài)頁面。對象可以隨著時(shí)間而改變，可以在頁面上順暢地運(yùn)動，而且用戶還可以像在實(shí)際生活中與事物進(jìn)行交互那樣對對象進(jìn)行操作。目前好多操作在桌面應(yīng)用程序中都已經(jīng)用濫了，如拖曳對象或者滑動控件，這些都是很好的桌面應(yīng)用的例子，不過這些操作現(xiàn)在還沒有被集成到Web中去。
在接下來的方法中，大家可以學(xué)到在頁面上移動對象所涉及的基本步驟，然后還可以應(yīng)用這些基本的知識來創(chuàng)建一個(gè)實(shí)時(shí)交互系統(tǒng)，如滑動控件和拖曳界面。
14.1 setTimeout和setInterval的使用
這兩個(gè)方法都可以用來實(shí)現(xiàn)在一個(gè)固定時(shí)間段之后去執(zhí)行JavaScript。不過兩者各有各的應(yīng)用場景。
方 法
實(shí)際上，setTimeout和setInterval的語法相同。它們都有兩個(gè)參數(shù)，一個(gè)是將要執(zhí)行的代碼字符串，還有一個(gè)是以毫秒為單位的時(shí)間間隔，當(dāng)過了那個(gè)時(shí)間段之后就將執(zhí)行那段代碼。
不過這兩個(gè)函數(shù)還是有區(qū)別的，setInterval在執(zhí)行完一次代碼之后，經(jīng)過了那個(gè)固定的時(shí)間間隔，它還會自動重復(fù)執(zhí)行代碼，而setTimeout只執(zhí)行一次那段代碼。
雖然表面上看來setTimeout只能應(yīng)用在on-off方式的動作上，不過可以通過創(chuàng)建一個(gè)函數(shù)循環(huán)重復(fù)調(diào)用setTimeout，以實(shí)現(xiàn)重復(fù)的操作：
File: settimeout_setinterval.js
showTime();
function showTime()
{
var today = new Date();
alert("The time is: " + today.toString());
setTimeout("showTime()", 5000);
}
一旦調(diào)用了這個(gè)函數(shù)，那么就會每隔5秒鐘就顯示一次時(shí)間。如果使用setInterval，則相應(yīng)的代碼如下所示：
File: settimeout_setinterval2.js
setInterval("showTime()", 5000);
function showTime()
{
var today = new Date();
alert("The time is: " + today.toString());
}
這兩種方法可能看起來非常像，而且顯示的結(jié)果也會很相似，不過兩者的最大區(qū)別就是，setTimeout方法不會每隔5秒鐘就執(zhí)行一次showTime函數(shù)，它是在每次調(diào)用setTimeout后過5秒鐘再去執(zhí)行showTime函數(shù)。這意味著如果showTime函數(shù)的主體部分需要2秒鐘執(zhí)行完，那么整個(gè)函數(shù)則要每7秒鐘才執(zhí)行一次。而setInterval卻沒有被自己所調(diào)用的函數(shù)所束縛，它只是簡單地每隔一定時(shí)間就重復(fù)執(zhí)行一次那個(gè)函數(shù)。
如果要求在每隔一個(gè)固定的時(shí)間間隔后就精確地執(zhí)行某動作，那么最好使用setInterval，而如果不想由于連續(xù)調(diào)用產(chǎn)生互相干擾的問題，尤其是每次函數(shù)的調(diào)用需要繁重的計(jì)算以及很長的處理時(shí)間，那么最好使用setTimeout。