这里写目录标题
1.定时器介绍
概念: 每隔一段时间需要自动执行一段代码
2.定时器的使用
定时器函数可以开启和关闭定时器
1.开启定时器
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 前端必备技能 -- 计时器函数
// 每个一段时间,自动执行一段代码
// 定时器可以开启和关闭
// 1.开启定时器
// setInterval(函数,间隔时间) --- 每隔一点时间就去调用一次函数
function a(){
document.write(1);
}
a()
setInterval(a,1000)
</script>
</body>
</html>
注意:
1.作用: 每隔一段时间调用这个函数
2.单位: 间隔时间单位是毫秒
3.函数名字不需要加括号
2.关闭定时器
一般不会刚创建就停止，而是满足一定条件再停止(简单的说就是加if判断一下)
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
</style>
</head>
<body>
<p id="box"></p>
<script>
// 关闭定时器
// let 变量名 = setInterval(函数,时间)
// clearInterval(变量名)
// 定义计数器
let i=1
function time() {
let date = new Date()
let h = date.getHours()
let f = date.getMinutes()
let s = date.getSeconds()
// 1.获取元素节点
let box = document.getElementById('box')
box.innerText = `${h}:${f}:${s}`
i++
// 在调用的函数中关闭定时器
if(i=== 7){ // 实际上是6次 -- 向几次就+1
clearInterval(lastTime)
}
}
time()
let lastTime = setInterval(time,1000)
</script>
</body>
</html>
不积跬步无以至千里,你生活的起点并不是那么重要，重要的是最后你能到达哪里!