JavaScript学习（五）——首页跳转实现

实现步骤

当前页面有一个倒计时
倒计时结束跳转，可以修改location.href属性来实现跳转页面

显示文字

<p>
    <span id="time">5span>秒后跳转首页
p>
1
2
3

定时器，让时间减少

var time = document.getElementById("time");
var s=5;
function changeTime(){
    s--;
}
setInterval(changeTime,1000);
1
2
3
4
5
6

增加判断倒计时结束的跳转

 if(s==0){
        location.href="https://www.baidu.com";
    }
    else {
        time.innerHTML = s;
    }
1
2
3
4
5
6

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
    <style>
        p{
            text-align: center;
        }
        span{
            color: red;
        }
    style>
head>
<body>
    <p>
        <span id="time">5span>秒后跳转首页
    p>
    <script>
        var time = document.getElementById("time");
        var s=5;
        function changeTime(){
            s--;
            if(s==0){
                location.href="https://www.baidu.com";
            }
            else {
                time.innerHTML = s;
            }
        }
        setInterval(changeTime,1000);
    script>
body>
html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

相关阅读:
位运算离散化区间和算法
js正则练习示例
C++指针常量，常量指针以及，引用和指针的区别
数据结构 —— BellmanFord算法
k8s集群安装部署实战详细手册
115 双周赛
Java Web（五）之 web核心（HTTP协议，Tomcat服务器，Servlet）
el-date-picker与el-time-picker的时间格式设置
力扣刷题之二叉树专栏
Django的设计模式及模板层

原文地址：https://blog.csdn.net/qq_41505957/article/details/126150627