zoukankan      html  css  js  c++  java
  • JavaScript时钟效果

      在JavaScript中,有一个内置对象Date,它重要的一个作用就是实现了时间的时刻更新,通过代码来创造一个实实在在的时间表。

      代码例子:

     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4         <meta charset="UTF-8">
     5         <meta name="author" content="惊风" />
     6         <meta name="Genarator" content="sublime"/>
     7     <title>时间的实现</title>
     8     <style type="text/css">
     9        #timetxt{
    10              width:100px;
    11              height:40px;
    12              background-color:#EABC46;
    13              font-size:20px;
    14              line-height:40px;
    15              margin:auto auto;
    16              text-align:center;
    17        }
    18     </style>
    19     <script type="text/javascript">
    20        function startTime(){
    21 
    22           var today=new Date(); //定义时间
    23           var h=today.getHours();  //小时
    24           var m=today.getMinutes();  //分钟
    25           var s=today.getSeconds();  //
    26  
    27           //调用函数
    28            h=checkTime(h);
    29 
    30            m=checkTime(m);
    31 
    32            s=checkTime(s);
    33 
    34           document.getElementById("timetxt").innerHTML=h+":"+m+":"+s; //时间显示的格式
    35           t=setTimeout(function(){
    36 
    37             startTime();
    38 
    39           },500);//500,是延时显示的意思,即500毫秒更新一次
    40 
    41        }
    42  
    43        //当分钟和秒是一位时候,需要在前面加0(才更符合要求)
    44        function checkTime(i){
    45 
    46          if(i<10){
    47 
    48            i="0"+i;
    49 
    50          }
    51 
    52          return i;
    53 
    54        }
    55 
    56        </script>
    57 </head>
    58     <body onload="startTime()">
    59        <div id="timetxt"></div>
    60     </body>
    61 </html>
  • 相关阅读:
    The Best Seat in ACM Contest
    确定比赛名次
    Red and Black
    Can you find it?
    胜利大逃亡
    Reward
    DXUT编译指南(转)
    逐顶点和逐像素光照
    转战DX
    hlsl之ambient
  • 原文地址:https://www.cnblogs.com/songtianfa/p/11276431.html
Copyright © 2011-2022 走看看