javascript 中可以通過使用 setinterval() 函數實現倒計時器,并顯示剩余秒數:確定要倒計時的秒數;創建剩余秒數變量;使用setinterval()函數每秒檢查剩余秒數并更新顯示;當剩余秒數為0時,清除定時器。
JavaScript 中的倒計時器實現秒數顯示
在 JavaScript 中,可以使用 setInterval()
函數來實現倒計時器并顯示剩余秒數。以下是如何實現:
步驟:
-
確定要倒計時的秒數。
創建一個變量來存儲剩余秒數。
使用
setInterval()
函數每秒檢查剩余秒數并更新顯示。當剩余秒數達到 0 時,清除定時器。
代碼示例:
<code class="javascript">// 設定倒計時秒數 const totalSeconds = 60; // 創建剩余秒數變量 let remainingSeconds = totalSeconds; // 創建定時器,每秒檢查剩余秒數 const timer = setInterval(() => { // 更新剩余秒數顯示 document.getElementById("timer").textContent = remainingSeconds; // 減少剩余秒數 remainingSeconds--; // 當剩余秒數達到 0 時,清除定時器 if (remainingSeconds === 0) { clearInterval(timer); } }, 1000);</code>
登錄后復制
代碼解釋:
totalSeconds
變量存儲要倒計時的秒數。
remainingSeconds
變量存儲剩余秒數,并在每次定時器觸發時更新。
setInterval()
函數每隔 1000 毫秒(1 秒)觸發一次回調函數。
在回調函數中,更新剩余秒數顯示、減少剩余秒數并檢查剩余秒數是否為 0。
如果剩余秒數為 0,則清除定時器以停止倒計時。