當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
JS-实现秒表倒计时+缓存倒计时
生活随笔
收集整理的這篇文章主要介紹了
JS-实现秒表倒计时+缓存倒计时
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
實現秒表倒計時+緩存倒計時功能
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title></head><body><p class="diffDate"></p><p class="counterSecond"></p></body><script type="text/javascript">countTime();function countTime() {var date = new Date();var now = date.getTime();var date2 = new Date();//倒計時10天date2.setDate(date2.getDate() + 10);var d, h, m, s, ms;//從本地獲取保存的時間var leftTime = '';var cacheDate = localStorage.getItem( "counter");if(cacheDate) {//緩存有值leftTime = new Date(parseInt(cacheDate)).getTime() - 1000;//更新緩存localStorage.setItem("counter", leftTime);}//如果沒有緩存或時間過期if(!cacheDate || leftTime < 0) {leftTime = date2.getTime() - now;//保存最后時間localStorage.setItem("counter", leftTime - 1000);}if(leftTime >= 0) {d = Math.floor(leftTime / 1000 / 60 / 60 / 24 % 31);h = Math.floor(leftTime / 1000 / 60 / 60 % 24);m = Math.floor(leftTime / 1000 / 60 % 60);s = Math.floor(leftTime / 1000 % 60);ms = Math.floor(leftTime % 1000);if(d < 10) {d = "0" + d;}if(h < 10) {h = "0" + h;}if(m < 10) {m = "0" + m;}if(s < 10) {s = "0" + s;}}//console.log(d + ":" + h + ":" + m + ":" + s + ":" + ms)document.getElementsByClassName("diffDate")[0].innerHTML = d + ":" + h + ":" + m + ":" + s;}setInterval(countTime, 1000);var diffCount = 0;/*** 從0到100計數*/function countMilSecond() {++diffCount;if(diffCount >= 100) {diffCount = 0;}if(diffCount < 10) {diffCount = '0' + diffCount;}document.getElementsByClassName("counterSecond")[0].innerHTML = diffCount;}setInterval(countMilSecond, 10);</script></html>效果：
總結
以上是生活随笔為你收集整理的JS-实现秒表倒计时+缓存倒计时的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Win10下的IIS的配置
- 下一篇： gradle idea java ssm