python/Day21-30/code/new/web1901/example_of_bom_1.html
2024-12-04 00:04:56 +08:00

34 lines
1003 B
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>BOM - 延迟跳转</title>
</head>
<body>
<h3><span id="countdown">5</span>秒钟以后自动跳转到百度</h3>
<button id="cancelBtn">取消跳转</button>
<button id="openBtn">打开百度</button>
<script>
// alert(localStorage.sport)
// alert(localStorage.fruit)
// localStorage.sport = '乒乓球'
// localStorage.fruit = '榴莲'
const openBtn = document.getElementById('openBtn')
openBtn.addEventListener('click', () => print())
const cancelBtn = document.getElementById('cancelBtn')
cancelBtn.addEventListener('click', () => clearInterval(timerId))
const span = document.getElementById('countdown')
var counter = 5
var timerId = setInterval(function () {
counter -= 1
if (counter == 0) {
// location对象代表了浏览器的地址栏
location.href = 'http://www.baidu.com'
} else {
span.textContent = counter
}
}, 1000)
</script>
</body>
</html>