/**
 * 节流函数
 */
var count = 1;
var container = document.getElementById('container');
function getUserAction(e) {
    // console.log(this)
    // console.log(e);
    container.innerHTML = count++;
}
function throttle(func, wait) {
    var context, args;
    var timeout;
    var previout = 0;
    return function() {
        context = this;
        args = arguments; // 可以拿到事件处理函数的 enent对象
        if(!timeout) {
            timeout = setTimeout( () => {
                timeout = null;
                func.apply(context, args)
            }, wait)
        }
    }
}
container.onmousemove = throttle(getUserAction, 2000, true);

js-防抖(简易版)的更多相关文章

  1. js实现简易版validate

    需求分析 项目中需要根据选择不同的类型,显示不同的表单,采用的方法是css隐藏显示不需要的表单,但是这个表单字段都是必填的,尝试把不同的表单放在不同的form里,提交时根据不同的类型调用miniui自 ...

  2. Javascript基础示例:用JS写简易版贪吃蛇(面向对象)

    废话不多说,代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  3. 来,我们手写一个简易版的mock.js吧(模拟fetch && Ajax请求)

    预期的mock的使用方式 首先我们从使用的角度出发,思考编码过程 M1. 通过配置文件配置url和response M2. 自动检测环境为开发环境时启动Mock.js M3. mock代码能直接覆盖g ...

  4. 实现简易版德州扑克|学习麻瓜编程以项目为导向入门前端 HTML+CSS+JS

    实现简易版德州扑克 1.先上达到网页效果图(简易版德州扑克) 网页分为发牌区和牌池,上面为发牌区,下面是牌池区 2. 代码实现 2.1 HTML和JS代码 ` <link rel="s ...

  5. 使用 js 和 Beacon API 实现一个简易版的前端埋点监控 npm 包

    使用 js 和 Beacon API 实现一个简易版的前端埋点监控 npm 包 前端监控,埋点,数据收集,性能监控 Beacon API https://caniuse.com/beacon 优点,请 ...

  6. 使用 js 实现一个简易版的模版引擎

    使用 js 实现一个简易版的模版引擎 regex (function test() { this.str = str; })( window.Test = ...; format() { let ar ...

  7. 使用 js 实现一个简易版的 drag & drop 库

    使用 js 实现一个简易版的 drag & drop 库 具有挑战性的前端面试题 H5 DnD js refs https://www.infoq.cn/article/0NUjpxGrqRX ...

  8. 使用 js 实现一个简易版的动画库

    使用 js 实现一个简易版的动画库 具有挑战性的前端面试题 animation css refs https://www.infoq.cn/article/0NUjpxGrqRX6Ss01BLLE x ...

  9. 使用 js 实现一个简易版的 GIPHY 动图搜索 web 应用程序

    使用 js 实现一个简易版的 GIPHY 动图搜索 web 应用程序 具有挑战性的前端面试题 API JAMstack refs https://www.infoq.cn/article/0NUjpx ...

  10. 使用 js 实现一个简易版的 async 库

    使用 js 实现一个简易版的 async 库 具有挑战性的前端面试题 series & parallel 串行,并行 refs https://www.infoq.cn/article/0NU ...

随机推荐

  1. angular Ionic CLI环境搭建安装以及栅格响应式布局

  2. OuputStreamWriter介绍-OuputStreamReader介绍

    OuputStreamWriter介绍 java.io.Outputstreamlwriter extends writeroutputStreamwriter:是字符流通向字节流的桥梁:可使用指定的 ...

  3. Java 进阶P-5.3+P-5.4

    封装 增加可扩展性 可以运行的代码!=良好的代码 对代码做维护的时候最能看出代码的质量 如果想要增加一个方向,如down或up 用封装来降低耦合 Room类和Game类都有大量的代码和出口相关 尤其是 ...

  4. inline的作用

    1:inline可以跳过调用,直接引用,类似与直接将函数中的代码拿到当前函数中一样 2:在.h中函数重复的时候可以用inline来解决冲突问题

  5. vue学习笔记(一) ---- vue指令(过滤器)

    一.什么是过滤器 官方文档:https://cn.vuejs.org/v2/guide/filters.html 二.过滤器的使用 没有使用过滤器之前: <div id="app&qu ...

  6. Python装饰器实例讲解(一)

    Python装饰器实例讲解(一) 多种角度讲述这个知识,这是个系列文章 但前后未必有一定的顺承关系 部分参考网络 本文以一个小案例引出装饰器的一些特点,不涉及理论,后面再谈 案例 写一个代码来求一个数 ...

  7. 如何使用 ArrayPool

    如果不停的 new 数组,可能会造成 GC 的压力,因此在 aspnetcore 中推荐使用 ArrayPool 来重用数组,本文将介绍如何使用 ArrayPool. 使用 ArrayPool Arr ...

  8. 钓鱼攻击之:CHM电子书钓鱼

    钓鱼攻击之:CHM电子书钓鱼 目录 钓鱼攻击之:CHM电子书钓鱼 1 CHM简介 2 .Chm文件因何变得危险 3 CHM 后门的优点 4 利用过程 4.1 准备工具 4.2 制作恶意chm文件 4. ...

  9. Jquery 点击弹窗,将弹窗内容赋值到各个项demo

    <div class="qb"> <div class="box"> <div class="qtt f_16 fbd& ...

  10. helm在k8s上部署Elasticsearch和Kibana

    前提 在win上安装docker desktop,没有网络限制,而且,打开kubernetes之后,很快就安装启动好了. 在win上安装scoop,有网络限制,需要访问github raw的文件内容, ...