javascript 體驗倒計時:距離國慶還有多長時間
阿新 • • 發佈:2018-04-15
get style var enter javascrip type utf fun ID
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Document</title>
6 <style>
7 div {
8 width: 1210px;
9 margin: 200px auto;
10 color: orange;
11 text-align : center;
12 font: 600 30px/30px "simSun";
13 }
14 </style>
15 </head>
16 <body>
17 <div></div>
18
19 <script>
20 var div = document.getElementsByTagName("div")[0];
21 var timer = setInterval(fn,500);
22
23 function fn(){
24 var nowtime = new Date();
25 var future = new Date("2018/10/01 10:10:10");
26 var timeSum = future.getTime() - nowtime.getTime();
27 var day = parseInt(timeSum/1000/60/60/24);
28 var hour = parseInt(timeSum/1000/60/60%24);
29 var minu = parseInt(timeSum /1000/60%60);
30 var sec = parseInt(timeSum/1000%60);
31 // var millsec = parseInt(timeSum%1000);
32
33 day = day < 10? "0"+day:day;
34 hour = hour < 10? "0"+hour:hour;
35 minu = minu < 10? "0"+minu:minu;
36 sec = sec < 10? "0"+sec:sec;
37 // if (millsec < 10) {
38 // millsec = "00"+millsec;
39 // }else if (millsec < 100) {
40 // millsec = "0"+millsec;
41 // }
42
43 if (timeSum < 0) {
44 div.innerHTML = "距離國慶節還有00天00小時00分00秒";
45 clearInterval(timer);
46 return;
47 }
48 div.innerHTML = "距離國慶節還有"+day+"天"+hour+"小時"+minu+"分"+sec+"秒";
49 }
50 </script>
51 </body>
52 </html>
javascript 體驗倒計時:距離國慶還有多長時間