HTML页面3秒后自动跳转的3中常见方法

最新推荐文章于 2022-05-08 21:45:07 发布

NUEST_LOVE

最新推荐文章于 2022-05-08 21:45:07 发布

阅读量8.8w

点赞数 2

分类专栏： HTML 文章标签：前端 HTML

本文链接：https://blog.csdn.net/NUEST_LOVE/article/details/86622823

版权

HTML 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">

<!-- 方法一：在meta里面添加，需要明白http-equiv是用来告诉浏览器要怎么做，定义好名称，
content是一定要和http-equiv或者name搭配使用的，用来存储值，简单点就是：名称/值 -->
<!-- 建议所有跳转路径都用相对路径 -->
<meta http-equiv="refresh" content="3;URL=cart.html">

<title>Insert title here</title>
</head>

<!-- 方法二：该段代码为设置2秒后页面自动跳转 -->
  <script type="text/javascript"> 
 onload=function(){//在进入网页的时候加载该方法 
    setTimeout(go, 2000);  /*在js中是ms的单位*/ 
                }; 
	    function go(){ 
	        location.href="cart.html"; 
	               } 
</script> 

<!--方法三： 该段代码为设置间隔为每2秒后页面执行一次go方法，显示时间x数值，当x<0后，自动跳转 -->
 <script type="text/javascript"> 
    onload=function(){ 
        setInterval(go, 2000); 
                    }; 
    var x=6; //利用了全局变量来执行 
    function go(){ 
        x--; 
        if(x>0){ 
        document.getElementById("sp").innerHTML=x; //每次设置的x的值都不一样了。 
    }else{ 
        location.href='cart.html'; 
        } 
    } 
</script>

<body>
<span style="white-space:pre">  </span>
<!-- 该段代码含义为保留span元素内的空白，span一般没什么含义，只是方便用来控制样式 -->
<span id="sp"></span>
<span style="white-space:pre">  </span>
</body>
</html>

NUEST_LOVE

关注

2
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
HTML页面3秒后自动跳转的3中常见方法

&lt;%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%&gt;&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt;&lt;meta charset="utf-8"&gt;
复制链接

扫一扫