思路:如果事件一直被觸發,也只在一定事件間隔才執行一次
//scroll方法中當間隔時間大於2s,do somthing執行一次
window.addeventlistener('scroll',function(),500);
starttime = curtime;}}
}());
也可以將節流函式封裝一下,我用的es6語法:
/**
* 節流函式
* @param fn function 觸發事件後需要執行的函式
* @param delay string 間隔時間 ms
* */
delayscrollfunc(fn, delay) , 60); // 在實際專案中,我發現這裡再延遲一點時間執行效果更好(針對監聽scroll)
},
頁面滾動事件scroll
在mounted鉤子函式裡面註冊scroll事件 mounted window.addeventlistener scroll this.about methods 判斷元素到達當前視窗的什麼位置 簡介 let isup true let titlediv document.getelementsb...
js 函式節流 與 防抖動
函式節流 就如同成都搖號買房,前乙個進去選房了,下乙個就要等一段時間。這種策略就很好的解決了,一大波人進去選房,銷售妹妹沒發接待的尷尬局面。應用場景 監聽瀏覽器滾動條,然後觸發函式。普通做法 document.getelementbyid throttle onscroll function 函式節...
前端效能篇 函式節流和去抖動
我們前端在開發過程經常用到 scroll resize等高頻的事件,特別在監測瀏覽器變化以及在下拉載入大資料的過程中,當這些高頻的事件發生時,這些高頻的事件觸發的頻次非常高,也非常大的多,間隔的時間也很短。如果這些高頻的事件中要及到大量的位置計算 dom 操作 ui重繪等等業務,但是偏偏業務計算和操...