利用JS编写一个定时秒表

最新推荐文章于 2024-09-23 23:30:08 发布

哈希加盐不要糖

最新推荐文章于 2024-09-23 23:30:08 发布

阅读量433

点赞数

文章标签： javascript 秒表计时

本文链接：https://blog.youkuaiyun.com/qq_40509841/article/details/82226787

版权

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
   </head>
   <body>
  //定义按钮，以及表现格式
       <span id="h"></span>: <span id="m"></span>: <span id="s"></span>: <span id="ss"></span><br />
   <input type="button" οnclick="startclock()" value="开始计时"/>
   <input type="button" οnclick="stopclock()" value="暂停计时"/>
   <input type="button" οnclick="endclock()" value="重置计时"/>

       <script language="JavaScript">
var h;//定义时
           var m;//定义分
           var s;//定义秒
           var ss;//定义毫秒
           var sec;//定义时间变量

           function start(){
               h=parseInt(document.getElementById("h").innerHTML);//将得到的时间格式化为整数类型
               m=parseInt(document.getElementById("m").innerHTML);
               s=parseInt(document.getElementById("s").innerHTML);
               ss=parseInt(document.getElementById("ss").innerHTML);

               ss+=1;
               if(ss<10){//判断时间增长循环函数
                   s+=1;
                   ss=0;
                   if(s>60){
                       m+=1;
                       s=0;
                       if(m>60){
                           h+1;
                           m=;
                       }
                   }
               }
               document.getElementById("h").innerHTML=h;//获得增长小时的数值
               document.getElementById("m").innerHTML=(m>60)?'0'+m:m;//判断分钟是否大于60，如果大于60，则将m归为0
               document.getElementById("s").innerHTML=(s>60)?'0'+s:s;
               document.getElementById("ss").innerHTML=ss;
           }


           function startclock(){//定义开始计时函数
               sec=setInterval("start()",100);
           }
           function stopclock(){//定义暂停计时函数
               clearInterval(sec);
           }
           function endclock(){//定义结束计时函数
               clearInterval(sec);
               document.getElementById("h").innerHTML=0;
               document.getElementById("m").innerHTML=0;
               document.getElementById("s").innerHTML=0;
               document.getElementById("ss").innerHTML=0;
           }

       </script>


   </body>
</html>