zoukankan      html  css  js  c++  java
  • 自定义日期格式-炫酷

    代码:

      1 <!DOCTYPE html>
      2 <html lang="en">
      3 <head>
      4     <meta charset="UTF-8">
      5     <title>自定义日期格式</title>
      6     <style>
      7         *{margin: 0;padding:0;}
      8         html, body{100%;height:100%;}
      9         body{background: black url(../bg/bg1.jpg);background-size: 100% 100%}
     10         #time{
     11              /* 400px; */
     12             height:306px ;
     13             position:fixed;
     14             left:0;right:0;top:0;bottom:0;
     15             margin: auto;
     16             /* background:black; */
     17             /* line-height: 100px; */
     18             text-align: center;
     19             font:bold 100px/1.5 georgia,sans-serif;
     20             color:white;
     21             text-shadow: 0 0 10px #fff,
     22                          0 0 20px #fff,
     23                          0 0 30px #fff,
     24                          0 0 40px #ff00de,
     25                          0 0 70px #ff00de,
     26                          0 0 80px #ff00de,
     27                          0 0 100px #ff00de,
     28                          0 0 150px #ff00de;
     29         }
     30     </style>
     31     <script>
     32         window.onload = function(){
     33             var oDiv = document.getElementById('time'); 
     34             setInterval(function(){
     35                 oDiv.innerHTML = showTime();
     36             },1000);
     37         }
     38 
     39 
     40         function showTime(){
     41             var d = new Date();
     42             var year = d.getFullYear();
     43             var month = d.getMonth() + 1;
     44             var day = d.getDate();
     45             var week = d.getDay();
     46             var hour = d.getHours();
     47             var min = d.getMinutes();
     48             var sec = d.getSeconds();    
     49             return year + '年' + doubleNum(month) + '月' + doubleNum(day) + '日 星期' + numOfChinese(week) + ' ' + doubleNum(hour) + ':' + doubleNum(min) + ':' + doubleNum(sec);    
     50 
     51 
     52 
     53             //单数变双数
     54             function doubleNum(num){
     55                 if(num < 10){
     56                     return '0' + num;
     57                 }
     58                 return num;
     59             }
     60 
     61             //星期  数字转中文
     62             function numOfChinese(num){
     63                 switch(num){
     64                     case 0:
     65                         return '天'
     66                         break;
     67                     case 1:
     68                         return '一'
     69                         break;
     70                     case 2:
     71                         return '二'
     72                         break;
     73                     case 3:
     74                         return '三'
     75                         break;
     76                     case 4:
     77                         return '四'
     78                         break;
     79                     case 5:
     80                         return '五'
     81                         break;
     82                     case 6:
     83                         return '六'
     84                         break;
     85                     default:
     86                         return 'error';
     87                         break;
     88                 }
     89             }
     90 
     91 
     92         }
     93 
     94 
     95 /*        var res = prompt('输入','1');
     96 
     97         alert(numOfChinese(Number(res)));*/
     98 
     99     </script>
    100 
    101 
    102 
    103 
    104 </head>
    105 <body>
    106     <div id="time"></div>
    107 </body>
    108 </html>
    查看代码

    浏览器效果:

  • 相关阅读:
    CentOS更改yum源与更新系统
    JQ兼容各种JS库的写法
    虚拟主机
    SSH安全登录(远程管理)22端口
    Samba服务器
    VSFTP服务
    网络配置和文件服务器
    服务和进程管理(二)
    攻防世界XCTF--一个登录验证页面(第六题)
    攻防世界XCTF--一个不能按的按钮(第五题)
  • 原文地址:https://www.cnblogs.com/taohuaya/p/9650360.html
Copyright © 2011-2022 走看看