1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43
| <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body> <div> <h1>倒计时</h1> <span class="day"></span> <span class="hour"></span> <span class="minute"></span> <span class="second"></span> </div> <script> const deadline = new Date("2019-10-1 00:00:00"); const dayElement = document.querySelector(".day"); const hourElement = document.querySelector(".hour"); const minuteElement = document.querySelector(".minute"); const secondElement = document.querySelector(".second");
const countDown = () => { const timeRemaining = deadline - new Date(); let day, hour, minute, second; if (timeRemaining < 0) { return 0; } day = Math.floor(timeRemaining / 1000 / 60 / 60 / 24); hour = Math.floor((timeRemaining / 1000 / 60 / 60) % 24); minute = Math.floor((timeRemaining / 1000 / 60) % 60); second = Math.floor((timeRemaining / 1000) % 60); dayElement.innerHTML = day + "天"; hourElement.innerHTML = hour + "时"; minuteElement.innerHTML = minute + "分"; secondElement.innerHTML = second + "秒"; setTimeout(countDown, 1000); };
countDown(); </script> </body> </html>
|