当前位置: 首页 > 知识库问答 >
问题:

javascript - 求教节流与防抖的实际应用代码?

康赞
2023-08-28
$("#ul_list").on("click", "li", function(e) {  //...li指定的列表数据拉取}

以上代码,如何加以节流、防抖,求代码及说明!!!感谢!!!

共有2个答案

龙繁
2023-08-28

$("#ul_list").on("click", "li", debounce(function(e) {
//...li指定的列表数据拉取
}))
debounce--防抖节流方法

冯枫
2023-08-28

节流

function throttle(func, delay) {  let timeoutId;  return function(...args) {    if (!timeoutId) {      func.apply(this, args);      timeoutId = setTimeout(() => {        timeoutId = null;      }, delay);    }  };}$("#ul_list").on("click", "li", throttle(function(e) {  // ... li指定的列表数据拉取}, 300)); // 延迟 300 毫秒执行一次

防抖

function debounce(func, delay) {  let timeoutId;  return function(...args) {    clearTimeout(timeoutId);    timeoutId = setTimeout(() => {      func.apply(this, args);    }, delay);  };}$("#ul_list").on("click", "li", debounce(function(e) {  // ... li指定的列表数据拉取}, 300)); // 延迟 300 毫秒执行,若期间有新事件则重新计时
 类似资料:
  • 本文向大家介绍js的节流和防抖?相关面试题,主要包含被问及js的节流和防抖?时的应答技巧和注意事项,需要的朋友参考一下 参考回答: http://www.cnblogs.com/coco1s/p/5499469.html 参考回答: 必要性:由于字符串、对象和数组没有固定大小,所有当他们的大小已知时,才能对他们进行动态的存储分配。JavaScript程序每次创建字符串、数组或对象时,解释器都必须分

  • 何谓节流和防抖? 节流 节流的意思是,规定时间内,只触发一次。比如我们设定500ms,在这个时间内,无论点击按钮多少次,它都只会触发一次。具体场景可以是抢购时候,由于有无数人 快速点击按钮,如果每次点击都发送请求,就会给服务器造成巨大的压力,但是我们进行节流后,就会大大减少请求的次数。 防抖 防抖的意思是,在连续的操作中,无论进行了多长时间,只有某一次的操作后在指定的时间内没有再操作,这一次才被判

  • 本文向大家介绍深入了解JavaScript 防抖和节流,包括了深入了解JavaScript 防抖和节流的使用技巧和注意事项,需要的朋友参考一下 概述 说明 在项目过程中,经常会遇到一个按钮被多次点击并且多次调用对应处理函数的问题,而往往我们只需去调用一次处理函数即可。有时也会遇到需要在某一规则内有规律的去触发对应的处理函数,所以就需要使用到函数防抖与函数节流来帮助我们实现我们想要的结果以及避免不必

  • 本文向大家介绍浅析JavaScript 函数防抖和节流,包括了浅析JavaScript 函数防抖和节流的使用技巧和注意事项,需要的朋友参考一下 函数防抖和节流都是对高频动作触发回调函数的一个优化,实现方式上有类似之处。先从使用场景做个区分。 防抖使用场景: 表单输入框校验 提交按钮避免重复提交 节流使用场景: scroll,mousemove,resize等 函数防抖(debounce) 表单输入

  • 本文向大家介绍JS中的防抖与节流及作用详解,包括了JS中的防抖与节流及作用详解的使用技巧和注意事项,需要的朋友参考一下 概念 函数防抖(debounce)是指在一定时间内,在动作被连续频繁触发的情况下,动作只会被执行一次,也就是说当调用动作过n毫秒后,才会执行该动作,若在这n毫秒内又调用此动作则将重新计算执行时间,所以短时间内的连续动作永远只会触发一次,比如说用手指一直按住一个弹簧,它将不会弹起直

  • 本文向大家介绍浅谈JS函数节流防抖,包括了浅谈JS函数节流防抖的使用技巧和注意事项,需要的朋友参考一下 在前端开发中有一部分的用户行为会频繁的触发事件执行,而对于DOM操作、资源加载等耗费性能的处理,很可能导致界面卡顿,甚至浏览器的崩溃。函数节流(throttle)和函数防抖(debounce)就是为了解决类似需求应运而生的。 函数节流(throttle) 函数节流就是预定一个函数只有在大于等于执