JavaScript的防抖和节流案例
更新时间:2021年06月25日 11:09:38 作者:zhi698999y
这篇文章介绍了JavaScript的防抖和节流案例的代码实现和概念.包含详细的代码,希望对你有所帮助
防抖:在一定的时间内只执行最后一次任务;
节流:一定的时间内只执行一次;
防抖
<button id="debounce">点我防抖!</button> $('#debounce').on('click', debounce()); function debounce() { let timer; // 闭包 return function () { clearTimeout(timer); timer = setTimeout(() => { // 需要防抖的操作... console.log("防抖成功!"); }, 500); } }
节流:
<button id="throttle">点我节流!</button> $('#throttle').on('click', throttle()); function throttle(fn) { let flag = true; // 闭包 return function () { if (!flag) { return; } flag = false; setTimeout(() => { console.log("节流成功!"); flag = true; }, 1000); }; }
到此这篇关于JavaScript的防抖和节流案例的文章就介绍到这了,更多相关JavaScript防抖和节流内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
JavaScript Window浏览器对象模型方法与属性汇总
本文给大家汇总分享的是JavaScript Window浏览器对象模型方法与属性,十分的细致全面,这里推荐给大家,有需要的小伙伴可以参考下。2015-04-04不用AI也能实现的文字自动播报(SpeechSynthesis文本实例合成)
SpeechSynthesis是HTML5的一个新特性,基于SpeechSynthesis可以实现在客户浏览器端进行动态文本的语音合成播放,这篇文章主要介绍了不用AI也能实现的文字自动播报(SpeechSynthesis文本实例合成),需要的朋友可以参考下2023-03-03
最新评论