js倒计时案例 

 1 <!--
 2  * @FilePath: 倒计时.html
 3  * @Author:马小屁
 4  * @Date: 2022-08-18 09:45:13
 5  * @LastEditors: Please set LastEditors
 6  * @LastEditTime: 2022-08-18 17:42:13
 7  * Copyright: 2022 xxxTech CO.,LTD. All Rights Reserved.
 8  * @Description: 
 9 -->
10 <!DOCTYPE html>
11 <html lang="en">
12 
13 <head>
14     <meta charset="UTF-8">
15     <meta http-equiv="X-UA-Compatible" content="IE=edge">
16     <meta name="viewport" content="width=device-width, initial-scale=1.0">
17     <title>倒计时</title>
18 </head>
19 
20 <body>
21     <div class="box"></div>
22     <script>
23 
24         function countDown(time) {
25             var nowDate = +new Date();//获取当前时间戳
26             var inputDate = +new Date(time);//获取输入时间的时间戳
27             var times = (inputDate - nowDate) / 1000 //获取总的毫秒数
28             var d = parseInt(times / 60 / 60 / 24);
29             d = d < 10 ? '0' + d : d
30             var h = parseInt(times / 60 / 60 % 24);
31             h = h < 10 ? '0' + h : h
32             var m = parseInt(times / 60 % 60);
33             m = m < 10 ? '0' + m : m
34             var s = parseInt(times % 60);
35             s = s < 10 ? '0' + s : s
36             var box = document.querySelector('.box');
37             box.innerHTML = `倒计时:${d}:${h}:${m}:${s}`;
38 
39         }
40         setInterval(function () { countDown('2022-8-18 18:00:00') }, 1000)
41     </script>
42 </body>
43 
44 </html>

 

posted @ 2022-08-18 17:52  丹江路39号  阅读(57)  评论(0)    收藏  举报