您現在的位置是:首頁 > 棋牌
JavaScript實現倒計時讀秒效果並跳轉
- 由 像蝸牛一樣瘋狂程式設計 發表于 棋牌
- 2021-09-29
簡介今天和大家分享一個小功能,就是使用JavaScript實現倒計時讀秒效果並跳轉功能我們先來分析一下需求,如何來實現自動跳轉的功能
倒計時怎麼讀
今天和大家分享一個小功能,就是使用JavaScript實現倒計時讀秒效果並跳轉功能
我們先來分析一下需求,如何來實現自動跳轉的功能。
1。顯示頁面效果
2。倒計時讀秒效果實現
2。1 定義一個方法,獲取span標籤,修改span標籤體內容,時間——
2。2 定義一個定時器,1秒執行一次該方法
3。在方法中判斷時間如果<= 0 ,則跳轉到首頁
具體的實現程式碼如下:
<!DOCTYPE html>
p{ text-align: center;}
span{color:red;}
5秒之後,自動跳轉到首頁。。。
// 2。倒計時讀秒效果實現
var second = 5;
var time = document。getElementById(“time”);
//定義一個方法,獲取span標籤,修改span標籤體內容,時間——
function showTime(){
second —— ;
//判斷時間如果<= 0 ,則跳轉到首頁
if(second <= 0){
//跳轉到首頁
location。href = “baidu。com”;
}
time。innerHTML = second +“”;
} //設定定時器,1秒執行一次該方法
setInterval(showTime,1000);
程式碼截圖如下:
最終的效果是這樣的:
好了,今天的分享就到這裡咯,再見
上一篇:說說我身邊三十年未破的懸案(三)
下一篇:維密諸神之冰美人尤金女皇