js函數節流和防抖

// 函數節流
var canRun = true;
document.getElementById("throttle").onscroll = function(){
    if(!canRun){
        // 判斷是否已空閒,若是在執行中,則直接return
        return;
    }

    canRun = false;
    setTimeout(function(){
        console.log("函數節流");
        canRun = true;
    }, 300);
};

  

// 函數防抖
var timer = false;
document.getElementById("debounce").onscroll = function(){
    clearTimeout(timer); // 清除未執行的代碼,重置回初始化狀態

    timer = setTimeout(function(){
        console.log("函數防抖");
    }, 300);
};  
相關文章
相關標籤/搜索