javaScript 实现显示当前时间

来源：互联网发布：传奇霸业魔血符数据编辑：程序博客网时间：2024/05/22 00:48

<!DOCTYPE html>

<head>
   <title>测试</title>
<style type="text/css">
#demo h2{margin:20px 0 20px 20%;font:normal 24px/1.5 'Comic Sans MS';letter-spacing:2px;line-hight:2}
#demo h2 em{margin-right:12px;padding:0 7px;border-top-left-radius:8px;-webkit-border-top-left-radius:8px;-moz-border-radius-topleft:8px;background:#d2d9df;color:#000;font-family:\5fae\8f6f\96c5\9ed1;letter-spacing:0}
#demo h2 span{text-shadow:1px 2px 3px #ccc}
</style>
</head>
<body>
   <div id="demo">
   <h2>显示当前时间：<span id="time24"></span></h2>
   </div>
<script type="text/javascript">
   window.onload = function(){nowTime(document.getElementById("time24"))};

   function nowTime(ev,type){
       /*
       * ev:显示时间的元素
       * type:时间显示模式.若传入12则为12小时制,不传入则为24小时制
       */
       //年月日时分秒
       var Y,M,D,W,H,I,S;

       //月日时分秒为单位时前面补零
       function fillZero(v){
           if(v<10){v='0'+v;}
           return v;
       }

       (function(){
           var d = new Date();
           var Week=['星期天','星期一','星期二','星期三','星期四','星期五','星期六'];
           Y = d.getFullYear();
           M = fillZero(d.getMonth()+1);
           D = fillZero(d.getDate());
           W = Week[d.getDay()];
           H = fillZero(d.getHours());
           I = fillZero(d.getMinutes());
           S = fillZero(d.getSeconds());
           //12小时制显示模式
           if(type && type==12){
               //若要显示更多时间类型诸如中午凌晨可在下面添加判断
               if(H<=12){
                   H='上午 '+H;
               }else if(H>12 && H<24){
                   H-=12;
                   H='下午 '+fillZero(H);
               }else if(H==24){
                   H='下午 00';
               }

           }
           ev.innerHTML=Y+'年'+M+'月'+D+'日 '+' '+W+' '+H+':'+I+':'+S;
           //每秒更新时间
           setTimeout(arguments.callee,1000);
       })();
   }

</script>
</body>
</html>

运行效果：

java后台获取当前时间，前台显示计算：