js 计时器小练-20160601

今天要做一个计时器小练，所以我就做了练习，代码如下。

 　　　　　　　// 初始化时间，以及定义全局量去接收计时器
             var timer = 0;
             var t;
             var h, min, sec, millisec;
             // 触发按钮的点击事件
             document.getElementById("btn").addEventListener("click", function() {
                 // 获取按钮上面的内容
                 var text = document.getElementById("btn").innerText;
                 // 判断按钮上面的内容，也就是把按钮上面的内容作为标识
                 if (text == "开始") {
                     // 当按下“开始”按钮的时候，按钮上面的文字变为“结束”，并且调用计时函数
                     this.innerText = "结束";
                     setTime();
                 } else {
                     // 当按下“结束”按钮的时候，按钮上面的文字变为“开始”，并且暂停计时
                     this.innerText = "开始";
                     clearTimeout(t);
                 }
             });
             // 计时函数
             function setTime() {
                 timer++;
                 // 转化为时，分，秒，毫秒
                 h = parseInt(timer / (3600 * 100));
                 min = parseInt(timer / (60 * 100) % 60);
                 sec = parseInt(timer / 100 % 60);
                 millisec = timer % 100;
                 // 通过判断时分秒小于10，在前面加“0”
                 if (sec < 10) {
                     sec = "0" + sec;
                 }
                 if (min < 10) {
                     min = "0" + min;
                 }
                 if (h < 10) {
                     h = "0" + h;
                 }
                 // 在input中显示结果
                 document.getElementById("content").value = h + ":" + min + ":" + sec + ":" + millisec;
                 t = setTimeout(setTime, 10);
             }

效果图如下：