1、setInterval与clearInervar
实现秒表功能
![](https://i-blog.csdnimg.cn/blog_migrate/d7d823cdf98e9c49dd390838bcceaefd.png)
2、setTimeout与clearTimeout
![](https://i-blog.csdnimg.cn/blog_migrate/07b41873f70d2b7205ad372ed1ee6cf3.png)
防抖与节流
解决性能问题,开发中经常遇到
防抖:对于短时间内多次触发事件的情况,可以使用防抖停止事件持续触发(当行为停止后触发)
![](https://i-blog.csdnimg.cn/blog_migrate/7276933105c14a798e0a66e19ff66664.png)
节流:防止短时间内多次触发事件的情况,但是间隔事件内,还需要不断触发(在行为过程中隔一段时间触发)
![](https://i-blog.csdnimg.cn/blog_migrate/125b880ac5f825d14f4210168c826532.png)
返回顶部效果
1、window.onscroll事件 ;滚动条滚动事件
2、document.documentElement.scrollTop:页面滚动位置距离顶部位置
3、window.scrollTo(0,0):让页面滚动条返回至顶部
练习
1、在网页中显示当前时间
2、在网页中制作一个秒表
3、实现一个五秒后跳转页面的效果
4、返回顶部(防抖)
5、返回顶部(节流)