一、前言

setTimeout(function, milliseconds) 在等待指定的毫秒數后執(zhí)行函數。setInterval(function, milliseconds) setTimeout()相同，但會重復執(zhí)行。

二、時間事件

窗口對象允許在指定的時間間隔執(zhí)行代碼。時間間隔稱為定時事件。

1. setTimeout() 方法

 
 
 
 

  
  
  
  
window.setTimeout(function, milliseconds); 
 
 
 
 

window.setTimeout() 方法可以不用窗口window前綴編寫。

第一個參數是要執(zhí)行的函數，第二個參數指示執(zhí)行前的毫秒數。

 
 
 
 

  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
點擊"試試". 等3秒，這個頁面將提示"Hello".
 
  
  
  
  
 
  
  
  
  
試試 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
 
 
 
 

如何停止執(zhí)行?

clearTimeout() 方法停止指定的函數setTimeout()的執(zhí)行。

語法：

 
 
 
 

  
  
  
  
window.clearTimeout(timeoutVariable) 
 
 
 
 

window.clearTimeout() 方法可以不用窗口window前綴編寫。

clearTimeout() 方法使用setTimeout()返回的變量。

 
 
 
 

  
  
  
  
myVar = setTimeout(function, milliseconds); 
  
  
  
  
clearTimeout(myVar); 
 
 
 
 

如果該函數尚未被執(zhí)行，則可以通過調用 clearTimeout() 方法:

例：

 
 
 
 

  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
點擊 "試試". 等3秒。這個頁面將出現一個"Hello".
 
  
  
  
  
單擊“停止”以阻止第一個功能執(zhí)行。
 
  
  
  
  
（您必須在3秒鐘之前單擊“停止”。）
 
  
  
  
  
 
  
  
  
  
試試 
  
  
  
  
 
  
  
  
  
停止 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
 
 
 
 

2. setInterval() 方法

setInterval() 方法在給定的時間間隔內重復給定的函數。

 
 
 
 

  
  
  
  
window.setInterval(function, milliseconds); 
 
 
 
 

window.setInterval() 方法可以不用窗口window前綴編寫。

第一個參數是要執(zhí)行的函數。

第二個參數指示每次執(zhí)行之間的時間間隔的長度。

例：

執(zhí)行一個稱為“myTimer”的函數，每隔二秒(像一個數字表)。

 
 
 
 

  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
A script on this page starts this clock:
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
 
 
 
 

(一秒鐘等于1000毫秒)。

如何停止執(zhí)行?

clearInterval() 方法停止指定的函數setInterval()的執(zhí)行。

 
 
 
 

  
  
  
  
window.clearInterval(timerVariable) 
 
 
 
 

window.clearInterval() 方法可以不用窗口window前綴編寫。

clearInterval() 方法使用從setInterval()返回的變量 。

 
 
 
 

  
  
  
  
 
  
  
  
  
 
  
  
  
  
   
  
  
  
  
     
  
  
  
  
     
  
  
  
  
   
  
  
  
  
   
  
  
  
  
 
  
  
  
  
    
A script on this page starts this clock:
 
  
  
  
  
 
  
  
  
  
    
 
  
  
  
  
 
  
  
  
  
    停止 
  
  
  
  
 
  
  
  
  
     
  
  
  
  
 
  
  
  
  
 
  
  
  
  
   
  
  
  
  
 
 
 
 
 

代碼解析：

運行效果：

三、總結

本文基于JavaScript基礎，介紹了JavaScript 時間事件 setTimeout()，setInterval() 方法，這兩種方法的語法，實際用法和區(qū)別。以及如何去啟動定時器，停止定時器，通過詳細案例分析。運行效果圖的展示。進行了詳細的講解。代碼很簡單，希望能夠幫助你學習。

希望大家可以根據文章的內容，積極嘗試，有時候看到別人實現起來很簡單，但是到自己動手實現的時候，總會有各種各樣的問題，切勿眼高手低，勤動手，才可以理解的更加深刻。

使用JavaScript 語言，方便大家更好理解，希望對大家的學習有幫助。

本文轉載自微信公眾號「前端進階學習交流」，可以通過以下二維碼關注。轉載本文請聯系前端進階學習交流公眾號。

文章標題：一篇文章帶你了解JavaScript時間
網頁網址：http://uogjgqi.cn/article/dhcpchj.html