1：如何判断一个元素是否出现在窗口可视范围（浏览器的上边缘和下边缘之间，肉眼可视）。
//函数实现方法
function isVisible($node){
var winH = $(window).height(),
scrollTop = $(window).scrollTop(),
offSetTop = $(window).offSet().top;
if (offSetTop < winH + scrollTop) {
return true;
} else {
return false;
}
}
//每次滚动检查元素是否出现在窗口可视范围内：每次出现都在控制台打印 true
$(window).on("scroll", function{
if (isVisible($node)){
console.log(true);
}
})
//元素只在第一次被检查到时打印true，之后就不再打印了
$(window).on('scroll',function(){
if(isVisible($node)){
if(!$node.hasClass('active')){
console.log('true');
$node.addClass('active')
}
}
});
2：图片懒加载的原理是什么？
懒加载的概念，就是等到让图片出现在浏览器中的窗口的时候再去加载该图片资源。
先将img标签中的src链接设为一个小图片（空白图片），将其真正的图片地址存储再img标签的自定义属性中（比如data-src）。当js监听到该图片元素进入可视窗口时，即将自定义属性中的地址存储到src属性中，达到懒加载的效果。
优点：减轻服务器的压力，可以让加载好的页面更快地呈现在用户面前。
新闻懒加载
index.html
router.js
