原生js 秒表实现代码

html代码：复制代码代码如下: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <meta charset="gb2312"> <head> <style type="text/css"> #container { margin:0 auto; margin-top:10%; width:200px; } #timer { border:red double 1px; width:180px; height:76px; line-height:76px; font-size:32pt; color:green; } input { width:87px; } </style> </head> <body onload="init()"> <div id="container"> <div id="timer"></div> <input type="button" id="ctrl" /> <input type="reset" onclick="init()" /> </div> </body> </html> js代码：复制代码代码如下: /* *@author:hyjiacan *date:15:57 2010-9-5 *name:timer */ var ctrl = document.getElementById("ctrl"); //控制按钮对象 var timer = document.getElementById("timer"); //时间显示对象 var hour, minute, second; //时，分 ,钞 var t; //setTimeout方法 //初始化显示和按钮 var init = function(){ timer.innerHTML = "00:00:00"; //由于FF不支持使用innerText，故采用innerHTML hour = minute = second = 0; //初始化显示 ctrl.setAttribute("value", "开始"); //初始化控制按钮文字 ctrl.setAttribute("onclick", "startit()"); //初始化控制按钮事件 clearTimeout(t); } //开始计时 function startit(){ t = setTimeout("startit()", 1000); //每隔1秒（1000毫秒）递归调用一次 second++; if(second>=60){ //判断秒是否到60, 是则进位 second = 0; minute++; } if(minute>=60){ //判断分是否到60, 是则进位 minute = 0; hour++; } timer.innerHTML = j(hour) + ":" + j(minute) + ":" + j(second) ; //更新显示 //更改按钮状态 ctrl.setAttribute("value", "暂停/停止"); //更改按钮文字 ctrl.setAttribute("onclick", "pause()"); //更改按钮触发事件 } //显示数字填补，即当显示的值为0-9时，在前面填补0;如：1:0:4, 则填补成为 01:00:04 var j = function(arg){ return arg>=10 ? arg : "0" + arg; } //暂停计时 var pause = function(){ clearTimeout(t); ctrl.setAttribute("onclick", "startit()"); ctrl.setAttribute("value", "继续"); } 使用setTimeout递归处理。在这之中，有一个很重要的问题——延迟，这样的做法和系统CPU资源有很大关系，而且函数的调用也要耗费时间，最终就导致计数的误差越来越大。还有另一个方法：在按下开始按钮的时候，记录下按下的时间（毫秒），然后每隔1秒读取一次当前时间，再用当前时间减去按下时记下的时间，算出经过了的时间。

　　推荐阅读

　　基于jQuery的获取标签名的代码

jquery如何获取一上元素的名称比如 <div id="aa">dd</div>$("#aa").xxxmethod 昨到"div"jquery如何获取一个元素的名称比如 <div id="aa">dd</div>$("#aa").xxxmethod 得到"div"[昆明]丝雪.川琼(447031499) 13:3>>>详细阅读

本文标题：原生js 秒表实现代码

地址：http://www.17bianji.com/kaifa2/JS/23235.html

1/2 1