题目1：如何判断一个元素是否出现在窗口可视范围（浏览器的上边缘和下边缘之间，肉眼可视）。写一个函数 isVisible实现
window.jpg
元素处于窗口高度外
窗口高度 + 垂直滚动距离 = 元素垂直方向距离
元素开始出现
窗口高度 + 垂直滚动距离 > 元素垂直方向距离
元素开始消失
垂直滚动距离 > 元素垂直方向距离
元素消失完毕
垂直滚动距离 > 元素垂直方向距离 + 元素自身高度
滚轮向下滚动的距离 == 元素上升的距离
function isVisible($node){
var scrollTop = $(window).scrollTop()
//滚动的高度
var windowHeight = $(window).height()
//窗口高度
var offsetTop = $node.offset().top
//元素距离顶端的高度
if( offsetTop < scrollTop + windowHeight && offserTop > scrollTop)
//元素距离顶端的高度 小于 窗口高度 并且 大于滚动高度（元素出现的时候）
{
return true
//返回true
}
return false
}
题目2：当窗口滚动时，判断一个元素是不是出现在窗口可视范围。每次出现都在控制台打印 true 。用代码实现
function isVisible($node){
var scrollTop = $(window).scrollTop()
//滚动的高度
var windowHeight = $(window).height()
//窗口高度
var offsetTop = $node.offset().top
//元素距离顶端的高度
if( offsetTop < scrollTop + windowHeight && offserTop > scrollTop)
//元素距离顶端的高度 小于 窗口高度 并且 大于滚动高度（元素出现的时候）
{
return true
//返回true
}
return false
}
//方法一
$(window).on('scroll',function(){
if(isVisible){
console.log(true)
}
})
------------------------------------
//方法二
$(window).on('scroll',function(){
xxx()
})
function xxx(){
$(node).each(function(){
if(isVisible($(this))){
console.log(true)
}
})
}
题目3：当窗口滚动时，判断一个元素是不是出现在窗口可视范围。在元素第一次出现时在控制台打印 true，以后再次出现不做任何处理。用代码实现
function isVisible($node){
var scrollTop = $(window).scrollTop()
//滚动的高度
var windowHeight = $(window).height()
//窗口高度
var offsetTop = $node.offset().top
//元素距离顶端的高度
if( offsetTop < scrollTop + windowHeight && offserTop > scrollTop)
//元素距离顶端的高度 小于 窗口高度 并且 大于滚动高度（元素出现的时候）
{
return true
//返回true
}
return false
}
var hadShow = false;
$(window).on('scroll',function(e){
var $markImg = $('.markImg');
//获取该元素
if(!hadshow && isVisiblie($markImg) ){
//事件为true并且元素出现在了窗口中
console.log(true);
//输出true
hadShow = true;
//改变值
}
})
题目4：图片懒加载的原理是什么？
以上的思路
1.对于所有的img标签，把真实的地址放入自定义属性data-img
2.当滚动页面时，检查页面所有的img标签，看看这个标签是否出现到我们的视野，当出现在我们视野时，再去判断它是否已经加载过，如果没有加载过，加载它。
另外的思路
展示一部分HTML内容，在底部埋入一个DOM节点，用户看不到这个节点，但在滚动的过程中，假设用户滚动到了底部，这个节点出现在浏览器窗口，向后台发送ajax请求，得到数据，把这些数据拼装成DOM放到页面上。这个加载节点又被新加入的元素撑下去了，当用户再滚动的过程中，重复获取添加数据。
懒加载的好处：同时加载所有图片，影响用户体验，浪费多余流量消耗（如：手机），出现卡顿情况，所以使用懒加载。
