js 节流

节流

 节流原理:规定时间内只执行一次,它与防抖的最大区别是,即使再高频的动作在规定的时间内都会执行一次。

如节流中提到的输入内容进行搜索的问题,使用防抖如果输入特别频繁,则不会发送请求,只有等输入停止时才会发送请求

而节流则在规定的时间内都会发送一次请求

js代码:

var text = document.getElementById('write');
function trol(fn,delay){
    var pre = new Date();
    return function () {
        var now = new Date();
        if(now-pre >= delay){
            fn();
            pre = new Date();
        }
    }
}
function write(){
    console.log(text.value);
}
text.addEventListener('input',trol(write,5000))

效果:

可以看到无论输入的速度是什么样的,都会每隔5秒发送一次请求

猜你喜欢

转载自blog.csdn.net/qq_37200686/article/details/83621126