zoukankan      html  css  js  c++  java
  • 函数节流

    在浏览器 DOM 事件里面,有一些事件会随着用户的操作不间断触发。比如:重新调整浏览器窗口大小(resize),浏览器页面滚动(scroll),鼠标移动(mousemove)。也就是说用户在触发这些浏览器操作的时候,如果脚本里面绑定了对应的事件处理方法,这个方法就不停的触发。

    这并不是我们想要的,因为有的时候如果事件处理方法比较庞大,DOM 操作比如复杂,还不断的触发此类事件就会造成性能上的损失,导致用户体验下降(UI 反映慢、浏览器卡死等)。所以通常来讲我们会给相应事件添加延迟执行的逻辑。

    于是就引入了计数器来解决这个问题:

    利用定时器,让函数执行延迟500毫秒,在500毫秒内如果有函数又被调用则删除上一次调用,这次调用500毫秒后执行,如此往复。

    var timer = null;
    window.onresize = function () {
        clearTimeout(timer);
        timer = setTimeout(function() {
            testFn();
        }, 500);
    };

    setTimeout的返回值:

    返回数值id,整型,可用于 取消 setTimeout 设置的函数clearTimeout(id)。也就是这个setTimeout的唯一标示符。

  • 相关阅读:
    js自执行函数的几种不同写法的比较
    chrome浏览器font-size<12px无效解决办法
    清楚浮动的那些事
    css中font-family的中文字体
    雅虎34条军规
    Modernizr的介绍和使用
    手机也能拍大片
    响应式Web设计 – 布局
    JAVA基础-JDBC连接池
    JAVA基础-JDBC使用
  • 原文地址:https://www.cnblogs.com/zyxiaohuihui/p/8986681.html
Copyright © 2011-2022 走看看