在學(xué)習(xí)js的過(guò)程中钱贯,我們必須學(xué)會(huì)的一個(gè)技能就是用JS去敲一個(gè)倒計(jì)時(shí)吹截,在生活中我們也經(jīng)常會(huì)見到倒計(jì)時(shí)厌处,像“雙11”鳖谈、“雙12”,“618”等等這些阔涉,在首頁(yè)是不是就經(jīng)常會(huì)看到倒計(jì)時(shí)這個(gè)東西缆娃。
下面我們來(lái)分析一下寫倒計(jì)時(shí)需要什么?瑰排?贯要??
1椭住、首先我們需要用function函數(shù)
2崇渗、其次我們是不是最少需要4個(gè)數(shù)據(jù):天、時(shí)京郑、分宅广、秒
3、最后需要一個(gè)計(jì)時(shí)器setInterval
接下來(lái)我們看代碼及注釋理解
// 在HTML中寫了一個(gè)h1標(biāo)簽些举,然后引入到j(luò)s中
var h = document.getElementsByTagName("h1")[0];
function daojiShi(storptimes) {
var newtime = new Date() //獲取當(dāng)前時(shí)間
var storptime = new Date(storptimes) //獲取截止時(shí)間
var mistiming = storptime.getTime() - newtime.getTime() // 獲取截止時(shí)間距離現(xiàn)在的毫秒差
var days = Math.floor(mistiming / 1000 / 60 / 60 / 24); //獲取天數(shù)
var hours = Math.floor(mistiming / 1000 / 60 / 60 % 24); // 獲取小時(shí)
var minutes = Math.floor(mistiming / 1000 / 60 % 60); //獲取分鐘數(shù)
var seconds = Math.floor(mistiming / 1000 % 60); //獲取秒數(shù)
// 判斷天跟狱、時(shí)、分金拒、秒是不是兩位數(shù)兽肤,如果是直接輸出,如果不是在前邊加個(gè)0;
days <10 ? days = "0"+days : days;
hours <10 ? hours = "0"+hours : hours;
minutes <10 ? minutes = "0"+minutes : minutes;
seconds <10 ? seconds = "0"+seconds : seconds;
// 第一種連接方法
// var rels = days + "天" + hours + "時(shí)" + minutes + "分" + seconds + "秒";
// 第二種連接方法
var rels = `${days}天${hours}時(shí)${minutes}分${seconds}秒`
// 判斷時(shí)間差是不是正數(shù)绪抛,就是截止時(shí)間是不是比現(xiàn)在的時(shí)間晚
var mis = mistiming > 0? rels:"請(qǐng)輸入正確的時(shí)間"
return mis
}
//用計(jì)時(shí)器去實(shí)現(xiàn)它
setInterval(function(){
//把倒計(jì)時(shí)放在h1標(biāo)簽中
h.innerHTML = daojiShi("2019,8,5")
},1000)//時(shí)間我們?cè)O(shè)置1000毫秒资铡,也就是1秒鐘
現(xiàn)在我們來(lái)看一下效果(恕在下只會(huì)截圖,在此謝罪)
現(xiàn)在我們基本就把倒計(jì)時(shí)這個(gè)東西就搞完了4甭搿s孕荨!症副!