js定时器做一个实现页面的倒数自动跳转
时间: 2023-07-20 16:24:51 浏览: 44
好的,可以使用JavaScript中的setTimeout()函数或setInterval()函数来实现一个页面的倒数自动跳转。以下是一个使用setTimeout()函数的示例代码:
HTML代码:
```html
<div id="countdown">10</div>
```
JavaScript代码:
```javascript
// 获取倒数的总秒数
var totalSeconds = 10;
// 获取页面中显示倒数的元素
var countdownElement = document.getElementById("countdown");
// 定义更新倒数的函数
function updateCountdown() {
// 倒数秒数减1
totalSeconds--;
// 更新页面中显示倒数的元素
countdownElement.innerHTML = totalSeconds;
// 如果倒数秒数为0,则自动跳转到目标页面
if (totalSeconds == 0) {
window.location.href = "目标页面的URL";
}
}
// 设置定时器,每隔1秒钟更新倒数
setTimeout(function() {
setInterval(updateCountdown, 1000);
}, 1000);
```
在上面的代码中,我们使用setTimeout()函数来延迟1秒钟执行setInterval()函数,然后使用setInterval()函数每隔1秒钟执行一次updateCountdown()函数,更新页面中显示的倒数秒数。当倒数秒数为0时,我们使用JavaScript中的window.location.href属性来实现自动跳转到目标页面。