倒計時代碼的步驟:
1喳资、首先生成一個模板
<div?id="box">倒計時:xxx天xx小時xx分鐘xx秒</div>
2讥耗、書寫模板的樣式
3岂膳、js邏輯
①思路:目標(biāo)時間的時間戳與當(dāng)前時間的時間戳的差值就是倒計時的時間戳绪穆,這里通過new.date().getTime()得到時間戳
②將得到的倒數(shù)時間戳轉(zhuǎn)換成時分秒的形式
③獲取模板元素砰蠢,通過innerHTML模板設(shè)置添加內(nèi)容
④需要每一秒執(zhí)行一次這個操作蓖扑,所以需要將這一系列步驟封裝到函數(shù)里,通過定時器調(diào)用台舱,為了首次頁面加載不會出錯律杠,需要提前手動調(diào)用一次這個函數(shù)
完整script代碼