[JS] 自己弄得个倒计时

Posted LeePC

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了[JS] 自己弄得个倒计时相关的知识,希望对你有一定的参考价值。

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>时间倒计时</title>
 6     <style>
 7     span{
 8         display: inline-block;
 9         
10     }
11     </style>
12 </head>
13 <body>
14 <center>
15     <span id="time">getbootstrap.com</span><br/>
16     <span id="time"></span><br/>
17     <span id="time1"></span><br/>
18     <span id="time2"></span><br/>
19     <span id="time3"></span><br/>
20     <span id="time4"></span><br/>
21     <span id="time5"></span><br/>
22 </center>
23     
24 </body>
25 <script>
26     function show_time(){
27         var now_time=new Date();//创建当前时间
28         // console.log(now_time.toLocaleString());//转化成本地时间
29         var new_time=new Date(2017,7,23);//设置活动时间
30         // console.log(new_time.toLocaleString());
31         var cu_time=new_time.getTime()-now_time.getTime();//看时间差
32         // console.log(cu_time);
33         // console.log(new_time.getTime());
34         // console.log(now_time.getTime());
35         var cu_seconds=parseInt(cu_time/1000%60);
36         var cu_seconds1=parseInt(cu_time/1000);
37         //把所获得的时间差转化成秒,原值是毫秒转化单位是1000,%60是为了余数且取整,为了更好展示
38         //console.log(cu_seconds);
39         var cu_minutes=parseInt(cu_time/1000/60%60);//原来同上,转化为分钟,取余值且取整
40         var cu_minutes1=parseInt(cu_time/1000/60);
41         //console.log(cu_minutes);
42         var cu_hours=parseInt(cu_time/1000/60/60%24);//原来同上,转化为小时,取余值且取整
43         var cu_hours1=parseInt(cu_time/1000/60/60);
44         //console.log(cu_hours);
45         var cu_day=parseInt(cu_time/1000/60/60/24);//原来同上,转化为天,且取整
46         var cu_day1=parseInt(cu_time/1000/60/60/24/30);
47         // console.log(cu_day);
48         time.innerHTML="<h2>"+"距离活动还有<font color=‘red‘ size=‘20px‘>"+cu_day+"</font>天<font color=‘red‘ size=‘20px‘>"+cu_hours+"</font>小时<font color=‘red‘ size=‘20px‘>"+cu_minutes+"</font>分<font color=‘red‘ size=‘20px‘>"+cu_seconds+</font>秒+"</h2>";
49         time1.innerHTML="<h2>"+"距离活动还有<font color=‘red‘ size=‘20px‘>"+cu_day1+"</font>个月</h2>";
50         time2.innerHTML="<h2>"+"距离活动还有<font color=‘red‘ size=‘20px‘>"+cu_day+"</font>天</h2>";
51         time3.innerHTML="<h2>"+"距离活动还有<font color=‘red‘ size=‘20px‘>"+cu_hours1+"</font>小时</h2>";
52         time4.innerHTML="<h2>"+"距离活动还有<font color=‘red‘ size=‘20px‘>"+cu_minutes1+"</font>分</h2>";
53         time5.innerHTML="<h2>"+"距离活动还有<font color=‘red‘ size=‘20px‘>"+cu_seconds1+"</font>秒</h2>";
54     }
55         setInterval(show_time,500);//设置定时器500毫秒刷新一次
56 
57 </script>
58 </html>

 

以上是关于[JS] 自己弄得个倒计时的主要内容,如果未能解决你的问题,请参考以下文章

python使用上下文对代码片段进行计时,非装饰器

JUC并发编程 共享模式之工具 JUC CountdownLatch(倒计时锁) -- CountdownLatch应用(等待多个线程准备完毕( 可以覆盖上次的打印内)等待多个远程调用结束)(代码片段

JS倒计时跳转页面

AJAX相关JS代码片段和部分浏览器模型

如何在使用片段和计时器的选项卡式活动上更新 UI

安全测试 web安全测试 常规安全漏洞 可能存在SQL和JS注入漏洞场景分析。为什么自己没有找到漏洞,哪么可能存在漏洞场景是?SQL注入漏洞修复 JS注入漏洞修复 漏洞存在场景分析和修复示例(代码片段