JS实现延时跳转到百度

钰子t

已于 2022-07-16 16:03:34 修改

阅读量1.7k

点赞数 1

分类专栏：前端文章标签： javascript 开发语言

于 2022-07-16 15:54:42 首次发布

本文链接：https://blog.csdn.net/m0_69100942/article/details/125820757

版权

前端专栏收录该内容

9 篇文章 0 订阅

订阅专栏

JS实现延时跳转百度

1 创建一个盒子

创建一个div盒子，存放5秒后跳转百度页面的提示信息。

<div id="one">5秒后开始跳转百度</div>

在这里插入图片描述

2 创建一个定时器

创建一个setInterval定时器，该定时器指每个一段时间执行一次函数。设置一个数num，用来倒计时，每执行一次函数，num减1，直到num减为0时，关闭setInterval定时器，并将此处页面的地址改为百度的地址。每次执行都修改一次页面显示的内容。

num = 5
t1 = setInterval(function() {
	num -= 1
	if(num == 0) {
		clearInterval(t1)
		window.location='https://www.baidu.com'
	}		document.getElementById('one').innerText=num+'秒后开始跳转百度'
	}, 1000)

3 完整代码如下

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<div id="one">5秒后开始跳转百度</div>
	</body>

</html>
<script type="text/javascript">
//	function openwindow1() {
//		//新窗口打开
//		window.open('https://www.baidu.com')
//		
//	}
	num = 5
	t1 = setInterval(function() {
		num -= 1
		if(num == 0) {
			clearInterval(t1)
//			openwindow1()
			//当前窗口打开
			window.location='https://www.baidu.com'
		}
		document.getElementById('one').innerText=num+'秒后开始跳转百度'
		console.log(num)

	}, 1000)
</script>