10秒倒計時實現HTML代碼如下:
<!DOCTYPE html> <html> <head> <script> var count = 10; // 設置倒計時秒數 function countdown() { var box = document.getElementById("countdown-box"); // 獲取倒計時容器元素 box.innerHTML = count; // 將當前倒計時秒數顯示在容器中 if (count >0) { count--; // 更新倒計時秒數 setTimeout(countdown, 1000); // 每隔1秒執行一次countdown函數 } else { box.innerHTML = "倒計時結束!"; // 倒計時結束時顯示的文本 } } </script> </head> <body onload="countdown()"> <p id="countdown-box"></p> // 倒計時容器元素 </body> </html>
通過以上代碼實現了一個簡單的10秒倒計時。其中,通過定時器setTimout()每隔1秒執行一次countdown()函數,實現秒數的倒計時。在頁面中添加了一個p標簽用于展示倒計時秒數,并在倒計時結束時展示“倒計時結束!”文本。
大家可以根據需要對具體的樣式和倒計時秒數進行調整和修改,實現更豐富和個性化的效果。