JavaScript 倒計時是一項非常常見的任務，它涉及到計時器的創建和管理，以便按照設定的時間間隔進行操作。讓我們進一步探討如何使用JavaScript進行倒計時、暫停和重新開始。 倒計時 一個典型的JavaScript倒計時實現需要使用setTimeout或setInterval。最好的處理方法是使用setTimeout，因為它只在計時周期結束后執行一次。假設我們需要一個10秒的倒計時。 ```html

倒計時：
10

``` ```javascript // 定義一個變量來保持倒計時 var counter; // 獲取倒計時元素 var countdown = document.getElementById('countdown'); // 啟動計時器 function startTimer(duration, display) { var timer = duration, minutes, seconds; counter = setInterval(function () { minutes = parseInt(timer / 60, 10); seconds = parseInt(timer % 60, 10); minutes = minutes< 10 ? "0" + minutes : minutes; seconds = seconds< 10 ? "0" + seconds : seconds; // 輸出到頁面上 display.textContent = minutes + ":" + seconds; // 倒計時減一秒 if (--timer< 0) { clearInterval(counter); } }, 1000); } // 啟動倒計時 window.onload = function () { startTimer(10, countdown); }; ``` 上面的代碼創建了一個10秒的倒計時，它使用了一些JavaScript函數來處理分鐘和秒的計算，以及更新輸出到文檔中的文本。 暫停和重新開始 在JavaScript中，我們可以使用clearInterval來停止計時器。所以，如果我們想在倒計時期間暫停時間并在稍后重新啟動它，你可以定義一個togglePause函數，其中調用clearInterval來停止計時器，并打開一個新的計時器并恢復倒計時。 ```javascript // 獲取暫停和恢復按鈕元素 var pause = document.getElementById('pause'); var resume = document.getElementById('resume'); // 定義暫停狀態標志 var isPaused = false; // 設置處理暫停和恢復操作的函數 function togglePause() { isPaused = !isPaused; if (isPaused) { clearInterval(counter); resume.style.display = 'block'; pause.style.display = 'none'; } else { startTimer(duration, display); resume.style.display = 'none'; pause.style.display = 'block'; } } // 啟動暫停和恢復功能 pause.onclick = togglePause; resume.onclick = togglePause; ``` 在上面的代碼中，我們使用togglePause函數來切換倒計時的暫停和恢復狀態。我們還需要將pause和resume按鈕的onclick事件指向該函數。當倒計時暫停時，我們將清除計時器并顯示resume按鈕。點擊按鈕時，我們使用startTimer函數重新開始倒計時，并顯示pause按鈕。 總結 以上就是使用JavaScript實現倒計時、暫停和重新開始的演示。雖然這僅僅是一個簡單的實現，但它給了我們處理定時任務的靈感。使用定時器，我們可以編寫充滿活力和創造力的網頁，甚至可以實現那些令人驚嘆的特效。