JS 封裝倒計時

2022-09-09 04:42:10 字數 950 閱讀 2988

最近的需求是:**使用 polyv 做的直播功能,左側有乙個倒計時功能

設計稿效果如圖:

前端實現效果如圖:

話不多說,直接上**

html **片段:

class="

countdown

">

"_d">

天 "_h

">"_m

">"_s

">

注意⚠️:樣式自己除錯一下

js **片段:document.addeventlistener(

'domcontentloaded

', () =>

//定義變數 d,h,m,s儲存倒計時的時間

vard, h, m, s

var day = document.getelementbyid('_d'

)

var hour = document.getelementbyid('_h'

)

var min = document.getelementbyid('_m'

)

var sec = document.getelementbyid('_s'

)

if (begtime >= 0)

else

settimeout(counttime,

1000) //

每一秒執行一次這個函式

} counttime()

//執行函式

})

js倒計時,秒倒計時,天倒計時

html 1 html 2 距某某開幕式還有 天 html html html id timer style color red 這次利用系統時間自校驗倒計時,無需手工調校使得倒計時更為精確,及詳細注釋如下 id clock 00 01 11 00 id startb type button val...

js 多個倒計時,毫秒倒計時

其實主要是借鑑了了這篇文的寫法 俺稍作了修改,以便更適合我的需要 實現功能 呼叫乙個函式,傳入html元素的id,和乙個截止時間 unix時間戳 在該html元素中列印出到當前到截止時間為止的倒計時,精確到毫秒 效果圖如下 h2 毫秒的倒計時 h2 div id timer1 div div id ...

倒計時 心跳倒計時

我從悶熱的午後醒來,可還是頭痛得厲害,睡意再次湧上心頭,我告訴自己不能再昏睡下去,於是決定出門去清醒一下。現在的天氣雖說有些燥熱,但是陰涼處還是比較涼爽,我慢慢地走,接著慢跑了起來,夕陽散發著最後一縷餘暉。我邊看著眼前的城市邊際的美景邊深呼吸著,隨著耳機裡傳來的 律動著。突然有個聲音從我腦海裡響起,...