JS使用setInterval實現(xiàn)的簡單計時器功能示例
本文實例講述了JS使用setInterval實現(xiàn)的簡單計時器功能。分享給大家供大家參考，具體如下：
使用setInterval實現(xiàn)計時，并且滿60秒向分鐘進一，滿60分鐘向小時進一。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>www.dhdzp.com JS計時器</title>
<script>
window.onload = function(){
var mm = 0;
var ss = 0;
var str = '';
var timer = setInterval(function(){
str = "";
if(++ss==60)
{
if(++mm==60)
{
mm=0;
}
ss=0;
}
str+=mm<10?"0"+mm:mm;
str+=":";
str+=ss<10?"0"+ss:ss;
document.getElementById("d").innerHTML = str;
},1000);
};
</script>
</head>
<body>
<div id="d"></div>
</body>
</html>
運行結(jié)果：
PS：這里再為大家推薦幾款時間及日期相關(guān)工具供大家參考使用：
在線秒表工具：
http://tools.jb51.net/bianmin/miaobiao
在線日期/天數(shù)計算器：
http://tools.jb51.net/jisuanqi/date_jisuanqi
在線日期天數(shù)差計算器：
http://tools.jb51.net/jisuanqi/onlinedatejsq
Unix時間戳(timestamp)轉(zhuǎn)換工具：
http://tools.jb51.net/code/unixtime
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript時間與日期操作技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運算用法總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計有所幫助。
相關(guān)文章
![javascript最短的拖動代碼[兼容FF]](http://img.jbzj.com/images/xgimg/bcimg0.png)
javascript最短的拖動代碼[兼容FF]...2007-10-10
在視頻前插入廣告...2006-11-11
這篇文章主要教大家學(xué)習(xí)使用Bootstrap頁面排版樣式，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-05-05
JS短信驗證碼倒計時功能的實現(xiàn)（沒有驗證碼，只有倒計時）
最近接了個項目，其中有這樣的需求：當(dāng)用戶想要獲取驗證碼時，就點擊免費獲取驗證碼 ，然后開始倒計時，倒計時期間按鈕文字為剩余時間x秒，且不可按狀態(tài)，倒計時結(jié)束后，按鈕更改為點擊重新發(fā)送，下面給大家分享js短信驗證碼倒計時實現(xiàn)代碼2016-10-10
javascript文件中的字符常量與所在的js文件字符編碼密切相關(guān)，如下一段代碼2009-11-11
textarea不能通過maxlength屬性來限制字?jǐn)?shù)的解決方法
textarea稱文本域，又稱文本區(qū)，其不能通過maxlength屬性來限制字?jǐn)?shù)，為此必須尋求其他方法來加以限制以達(dá)到預(yù)設(shè)的需求2014-09-09
javascript實現(xiàn)簡單的省市區(qū)三級聯(lián)動
本文給大家反映的是javascript實現(xiàn)的簡單的省市區(qū)三級聯(lián)動特效，不需要訪問后臺服務(wù)器端，不使用Ajax，無刷新，純JS實現(xiàn)的省市區(qū)三級聯(lián)動。當(dāng)省市區(qū)數(shù)據(jù)變動是只需調(diào)正js即可。2015-05-05
JavaScript比較當(dāng)前時間是否在指定時間段內(nèi)的方法
這篇文章主要介紹了JavaScript比較當(dāng)前時間是否在指定時間段內(nèi)的方法,涉及javascript時間與字符串的轉(zhuǎn)換及比較操作相關(guān)技巧,需要的朋友可以參考下2016-08-08
學(xué)習(xí)Javascript面向?qū)ο缶幊讨庋b
這篇文章主要幫助大家學(xué)習(xí)Javascript面向?qū)ο缶幊讨庋b，由淺入深的介紹了封裝的概念定義，感興趣的小伙伴們可以參考一下2016-02-02
這篇文章主要介紹了小程序中設(shè)置緩存過期的實現(xiàn)方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-01-01