懒加载

题目1：

如何判断一个元素是否出现在窗口可视范围（浏览器的上边缘和下边缘之间，肉眼可视）。写一个函数 isVisible实现

function isVisible($node){
        var scrollTop=$(window).scrollTop()
        var $bHeight=$(window).height()+scrollTop
        var offsetTop=$node.offset().top
        var $sHeight=offsetTop+$node.outerHeight()
    
        if (offsetTop<$bHeight&&$sHeight>scrollTop){
            $node.addClass("load")
            return true
        }else{
           return false
        }
}

题目2：

当窗口滚动时，判断一个元素是不是出现在窗口可视范围。每次出现都在控制台打印 true 。用代码实现

代码和效果

题目3：

当窗口滚动时，判断一个元素是不是出现在窗口可视范围。在元素第一次出现时在控制台打印 true，以后再次出现不做任何处理。用代码实现

题目4：

图片懒加载的原理是什么？

临界条件：
1，图片顶部刚好到达可是区窗口的底部
2，图片顶部刚好要出窗口顶部，和图片底部（包括margin值）刚好到达可是区窗口的顶部

//元素顶部到达文档顶部的距离
var offsetTop=$node.offset().top
//满足下面条件，表示元素在可视区窗口里面
 offsetTop<$(window).height()+scrollTop&&offsetTop+$node.outerHeight()>$(window).scrollTop()

题目5：

实现视频中的图片懒加载效果

效果
代码

题目6：

实现视频中的新闻懒加载效果

代码