javascript实现效果——5秒后跳转至指定页面

最新推荐文章于 2023-03-30 14:02:59 发布

原创最新推荐文章于 2023-03-30 14:02:59 发布 · 6.7k 阅读

12 ·

CC 4.0 BY-SA版权

文章标签：

#JavaScript #location #setInterval #href

日常练习--前端小效果专栏收录该内容

19 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现的页面倒计时自动跳转的方法。通过设置定时器和location对象的href属性，可以在指定时间后自动将用户引导至另一个网页。此方法适用于网页重定向或广告页面倒计时等场景。

分析：

1、需要跳转，则要用到 location对象的href属性。

2、倒计时5秒需要使用定时器 setInterval。

HTML：

<div id="msg"></div>

JavaScript：

window.onload=function(){
        var div=document.getElementById("msg");
        var time=5;
        var timer=setInterval(function(){
            if(time==0){
                location.href="https://www.youkuaiyun.com";
            }else{
                div.innerHTML="将在 "+time+" 秒后跳转";
                time--; 
            }
        },1000)
}