手写图片懒加载

//50ms节流方案
let lazyLoadThrottle = throttle(lazyLoad,50);
window.addEventListener('scroll',lazyLoadThrottle);

//raf的一帧节流方案
var isScroll = true;
window.addEventListener('scroll',function(){
    if(isScroll) return;
    requestAnimationFrame(lazyLoad);
})

function lazyLoad(opts){
    isScroll = true;
    let {conSel,imgSel,offset} = opts;
    let imgCon = document.querySelector(conSel);
    let rect = document.getBoundingClientRect();
    let clientH = document.documentElement.clientHeight;
    if(rect.top - clientH <= offset){
        let imgs = Array.from(imgCon.querySelector(imgSel));
        imgs.forEach(item => {
            let src = item.getAttribute('data-src');
            if(!src) return;
            item.src = src;
            item.removeAttribute('data-src');
        })
    }
}

function throttle(fn,interval){
    //last为0，cur必然大于它，fn会先立即执行一次
    let last = 0;
    return function(){
        let cur = +new Date();
        if(cur - last >= interval){
            fn.apply(this,args);
            last = cur;
        }
    }
}