起首有一个题目

src和href属性都用来包括一些外部的实体，那末有什么区别？

src：source用于替换元素（replaced elements简而言之，就是表面和尺寸由外部资本来定义，有img，button，textarea，input，select，object）。
href：Hypertext Reference，指定了web资本的定位。因而定义了一个衔接或许如今元素之间的关联（比方锚和目的地），或许是当前文档（比方link标签）和属性定位的资本间的关联。
所以我们如许写
<link href="style.css" rel="stylesheet" />
阅读器就可以明白这是一个款式表，而且剖析（parse）页面的时刻不会中缀（然则能够由于阅读器须要根据款式来绘制衬着界面而中缀衬着render）。跟把一切css文件倒到style标签不一样。因而也发起用link，不要用 @import来导款式表 。

src属性只是在当前的文本元素定义的处所嵌套了一个资本。
比方当阅读器看到
<script src="script.js"></script>
页面的下载和处置惩罚会被停止，直到阅读器猎取，编译，实行了文件。相似于把一切的js文件都倾倒在script标签里。img标签也是相似的。只是一个空标签，内容由src定义，阅读器会停息加载，直到猎取和加载完图象。
这也是为何要把js文件放在body的末了的缘由。
参考来自http://stackoverflow.com/ques…

想到了一个有意思的完成。
先不给img标签加上src，直到阅读到了这个位置再加载。关于挪动端，还能省流量。

所以来完成一下。
第一个题目在于猎取图片间隔可见局限下边的间隔。
几个尺寸属性参考http://www.jianshu.com/p/187c…
先猎取元素间隔上边的间隔，再猎取屏幕可用高度，以及滑动高度。
从而获得间隔视图下方的高度。

第二个题目在于撙节，总不能每滑动一下都实行一遍。有两个完成。同步和异步的体式格局各完成了。

handleScroll=(callback)=>{
        let previousCall=new Date().getTime();
        return (e=>{
            let diff=new Date().getTime()-previousCall
            if(diff>INTERVAL){
                callback.apply(null,arguments);
                previousCall=new Date().getTime();
            }
        })
    }
window.addEventListener('scroll',handleScroll(checkImgs));
//或许
let wait=false;
ontimeLoad=(e)=>{
    if(!wait){
      wait=true;
      setTimeout(function(){
        wait=false;
        checkImgs();
      },10);
    }
}
window.addEventListener('scroll',ontimeLoad);

不过第一种的话有个题目，就是不能removeEventListener了

源码：
https://github.com/zxf14/font…