节流和防抖动
节流和防抖动大家都在讲,我也就随便写下自己的理解用作记录,并没有什么高论
节流用在滚动条滚动onscroll和页面被调整onresize这种频繁触发事件的情况,可能一秒几十次的触发,然后在肉眼看来函数执行那么多次并没有多大区别,所以用节流的方式来控制触发的频率。
节流的用法,可以用settimeout来实现
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div class="e" >
<div class="ae" style="height:400px" >
</div>
</div>
</body>
</html>
<script>
var a = document.querySelector('.e')
a.onscroll = b
var is = true
function aa(){
if(!is){
r eturn
}
is = false
setTimeout(
()=> {
console.log('节流')
is = true
},300
)
}
</script>
<style>
.e{
overflow: auto;
height: 100px;
width: 100px;
border: 1px solid rebeccapurple
}
</style>