Js实现倒计时的效果

mac2024-05-15  27

Js实现倒计时的效果

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> div { width: 300px; height: 60px; line-height: 35px; text-align: center; border: 1px solid #000; } </style> </head> <body> <div id="box"></div> <script> var o = document.getElementById("box");//获取页面中的div function showTime() { var endDate = new Date("2020/1/1/12:00:00") ; var newDate = new Date(); var num = (endDate.getTime() - newDate.getTime()) / 1000; var hour = parseInt(num / 60 / 60); if (hour < 10) { hour = "0" + hour; } var minute = parseInt(num / 60) % 60; if (minute < 10) { minute = "0" + minute; }; var second = parseInt(num % 60); if (second < 10) { second = "0" + second; }; var time = "距离2019年10月30号00:00:00:还剩" + hour + ":" + minute + ":" + second; o.innerHTML = time; setTimeout(showTime, 1000)} showTime(); </script> </body> </html>

注意: 1.实现倒计时的前提一定要获取当前时间和截至时间。 2.用getTime()方法(返回 1970 年 1 月 1 日至今的毫秒数。)拿截至时间减去当前时间就得出了时间差,然后进行换算就可以了。

最新回复(0)