题目1：如何判断一个元素是否出现在窗口可视范围（浏览器的上边缘和下边缘之间，肉眼可视）。写一个函数 isVisible
实现
function isVisible($node){
var scrollTop = $(window).scrollTop()//获取window相对滚动条顶部的偏移
var windowHeight = $(window).height()//获取window窗口的高度
var offSetHeight = $node.offset().top//获取匹配元素在当前视口的相对偏移
var height = $node.height()//元素高度
if(offSetHeight < scrollTop + windowHeight && (offSetHeight + height) < scrollTop){
return true
}
return false
}
题目2：当窗口滚动时，判断一个元素是不是出现在窗口可视范围。每次出现都在控制台打印 true 。用代码实现
$(window).scroll(function(){
var scrollTop = $(window).scrollTop()
var windowHeight = $(window).height()
var offSetHeight = $node.offset().top
var height = $node.height()
if(offSetHeight < scrollTop + windowHeight && (offSetHeight + height) < scrollTop){
console.log(true)
}
})
题目3：当窗口滚动时，判断一个元素是不是出现在窗口可视范围。在元素第一次出现时在控制台打印 true，以后再次出现不做任何处理。用代码实现
$(window).scroll(function(){
var scrollTop = $(window).scrollTop()
var windowHeight = $(window).height()
var offSetHeight = $node.offset().top
var height = $node.height()
if(offSetHeight < scrollTop + windowHeight && (offSetHeight + height) < scrollTop){
if($node.attr('isload')==='1'){
return;
}else{
console.log(true);
$node.attr('isLoad','1');
}
})
题目4： 图片懒加载的原理是什么？
图片懒加载的原理是将页面里所有img属性src属性用data-xx代替并，而且页面滚动直至此图片出现在可视区域时，用js改变元素的属性src属性，使图片在可视时被加载。
一般实现方法：获取窗口的高度，页面滚动的高度和图片偏离根元素的top相对值。判断图片偏离根元素的top相对值是否大于窗口高度加上页面滚动的高度，如果否则进入可视范围，同时修改图片src的值为图片地址。
