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

实现步骤

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

显示文字

<p>
    <span id="time">5</span>秒后跳转首页
</p>

定时器，让时间减少

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

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

 if(s==0){
        location.href="https://www.baidu.com";
    }
    else {
        time.innerHTML = s;
    }

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        p{
            text-align: center;
        }
        span{
            color: red;
        }
    </style>
</head>
<body>
    <p>
        <span id="time">5</span>秒后跳转首页
    </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>

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

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

悦读