日历 

  1 <!DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8">
  5     <meta name="viewport" content="width=device-width, initial-scale=1">
  6     <title>Document</title>
  7     <style type="text/css">
  8         *{
  9             margin:0;
 10             padding: 0; 
 11             font-size: 0px;
 12             font-family: '微软雅黑';
 13         }
 14         .contain-wrapper{
 15             margin: 0 auto;
 16             padding-top: 70px;
 17             width: 470px;
 18             height: 230px;
 19             background: #000000;
 20             border-radius: 30px;
 21         }
 22         .timer-wrapper p{
 23             font-size: 44px;
 24             color: #ffffff;
 25         }
 26         .year{
 27             width: 470px;
 28             text-align: center;
 29         }
 30         .timer-footer{
 31             width: 460px;
 32             text-align: center;
 33         }
 34         .timer-footer p:nth-child(1){
 35             display: inline-block;
 36         }
 37         .timer-footer p:nth-child(2){
 38             display: inline-block;
 39         }
 40     </style>
 41 </head>
 42 <body>
 43     <div class="contain-wrapper">
 44         <div class="timer-wrapper">
 45             <p class="year"></p>
 46             <div class="timer-footer">
 47                 <p></p>
 48                 <p></p>
 49             </div>
 50         </div>
 51     </div>
 52 </body>
 53 <script type="text/javascript">
 54         
 55         /*
 56         *这是一个获取当前日期的函数
 57          */
 58         function showLocaleDate(objb){
 59             var str = objb.getFullYear()+"年"+(objb.getMonth()+1)+"月"+objb.getDate()+"日";
 60             return str;
 61         }
 62         var year=document.getElementsByClassName('timer-wrapper')[0].getElementsByTagName('p')[0];
 63 
 64         
 65         /*
 66         *这是一个获取星期几的函数
 67          */
 68         function showLocaleWeek(objC){
 69             var weekArray = new Array("日", "一", "二", "三", "四", "五", "六");  
 70             var week = objC.getDay();  
 71             var weekString = "星期"+ weekArray[week];
 72             return weekString;
 73         }
 74         var wk=document.getElementsByClassName('timer-wrapper')[0].getElementsByTagName('p')[1];
 75         /*
 76         *这是一个获取当前时间的函数
 77          */
 78 
 79         function showLocaleTime(objD){
 80             var hh = objD.getHours();
 81             if(hh<10) hh = '0' + hh;
 82             var mm = objD.getMinutes();
 83             if(mm<10) mm = '0' + mm;
 84             var ss = objD.getSeconds();
 85             if(ss<10) ss = '0' + ss;
 86             var reflash=hh + ":" + mm + ":" + ss;
 87             return reflash;
 88         }
 89         var now=document.getElementsByClassName('timer-wrapper')[0].getElementsByTagName('p')[2];
 90 
 91         function showTime(){
 92             var today=new Date();
 93             year.innerHTML=showLocaleDate(today);
 94             wk.innerHTML=showLocaleWeek(today);
 95                 now.innerHTML=showLocaleTime(today);
 96                 window.setTimeout("showTime()",1000);
 97         }
 98         showTime();
 99 </script>
100 </html>

 

posted @ 2017-10-25 13:39  维尼熊320  阅读(134)  评论(0)    收藏  举报