码迷,mamicode.com
首页 > Web开发 > 详细

JS — 实现简单的数字时钟

时间:2018-11-16 11:42:09      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:get   简单的   filter   htm   lte   demo   javascrip   ntb   css   

js实现简单的数字时钟

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>JS — 实现简单的数字时钟效果</title>
 6     <link rel="stylesheet" type="text/css" href="">
 7 </head>
 8 <body>
 9     <div class="demo">
10         <span id="nowTime"></span>
11     </div>
12 </body>
13 <script type="text/javascript">
14     var newDate = ‘‘;
15     getLangDate();
16     function dateFilter(date){ //值小于10时,在前面补0
17         if(date < 10){
18             return "0"+date;
19         }
20         return date;
21     }
22 
23     function getLangDate(){
24         var dateObj = new Date(); //表示当前系统时间的Date对象
25         var year = dateObj.getFullYear(); //当前系统时间的完整年份值
26         var month = dateObj.getMonth()+1; //当前系统时间的月份值
27         var date = dateObj.getDate(); //当前系统时间的月份中的日
28         var day = dateObj.getDay(); //当前系统时间中的星期值
29         var weeks = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
30         var week = weeks[day]; //根据星期值,从数组中获取对应的星期字符串
31         var hour = dateObj.getHours(); //当前系统时间的小时值
32         var minute = dateObj.getMinutes(); //当前系统时间的分钟值
33         var second = dateObj.getSeconds(); //当前系统时间的秒钟值
34         var timeValue = "" +((hour >= 12) ? (hour >= 18) ? "晚上" : "下午" : "上午" ); //当前时间属于上午、晚上还是下午
35         newDate = dateFilter(year)+"-"+dateFilter(month)+"-"+dateFilter(date)+" "+dateFilter(hour)+":"+dateFilter(minute)+":"+dateFilter(second);
36         document.getElementById("nowTime").innerHTML = "当前时间: "+newDate+" "+week;
37         setTimeout(getLangDate,1000);
38     }
39 </script>
40 </html>

 

JS — 实现简单的数字时钟

标签:get   简单的   filter   htm   lte   demo   javascrip   ntb   css   

原文地址:https://www.cnblogs.com/whx-blogs/p/9968263.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!