页面自动跳转的几种方式

最新推荐文章于 2019-05-09 14:24:00 发布

下雨了620

最新推荐文章于 2019-05-09 14:24:00 发布

阅读量2k

点赞数

分类专栏： html js 文章标签： javascript html

本文链接：https://blog.csdn.net/wodexiaoyang/article/details/50569188

版权

js 同时被 2 个专栏收录

12 篇文章 0 订阅

订阅专栏

html

9 篇文章 0 订阅

订阅专栏

原理说明
           1. DOM 函数
               setTimeout
                   setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。
               setTimeout(code,millisec)
                   code   必需。要调用的函数后要执行的 JavaScript 代码串。
                   millisec   必需。在执行代码前需等待的毫秒数。

                   setTimeout() 只执行 code 一次。如果要多次调用，请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。

               setInterval
                   setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。
                   setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
               setInterval(code,millisec[,"lang"])
                   code   必需。要调用的函数或要执行的代码串。
                   millisec   必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。

           2.HTML meta refresh
               refresh出现在http-equiv属性中，使用content属性表示刷新或跳转的开始时间与跳转的网址

实现方式															
															
			setTimeout												
				<script type="text/javascript"> 											
					//3秒钟之后跳转到指定的页面 										
					setTimeout(window.location.href='http://www.daimajiayuan.com',3); 										
				</script> 											
															
															
			setInterval												
				<html> 											
				<head> 											
				<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 											
				<title>js定时跳转页面的方法</title> 											
				</head> 											
				<body> 											
				<script type="text/javascript"> 											
					var t=10;//设定跳转的时间 										
					setInterval("refer()",1000); //启动1秒定时 										
					function refer(){  										
						if(t==0){ 									
						     location="http://www.daimajiayuan.com/sitejs-17251-1.html"; //#设定跳转的链接地址 									
						} 									
						document.getElementById('show').innerHTML=""+t+"秒后跳转到代码家园"; // 显示倒计时 									
						t--; // 计数器递减 									
						//本文转自： 									
					} 										
				</script> 											
				<span id="show"></span> 											
				</body> 											
				</html> 											
															
			HTML meta refresh												
				<!doctype html>											
				<html>											
				<head>											
				<meta charset="utf-8">											
				<title>前端笔记</title>											
				<meta http-equiv="refresh" content="3;url=http://www.cssue.com/">											
				</head>											
				<body>											
				</body>											
				</html>