懒加载

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

function isVisible(node){ var windowHeight = $(window).height(); var scrollTop = $(window).scrollTop(); var top = $node.offset().top; if( windowHeight + scrollTop > top $$ windowHeight + scrollTop<top+$node.outHeight()){ return true }else{ return false } }

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

$(window).on("scroll",function(){ if(isVisible(node)){ console.log(true); } })

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

$(window).on("scroll",function(){ if(isVisible(node) $$ !$node.data("hasLoad")){ console.log(true); $node.data("hasLoad",true) } })

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

原理：先将img标签中的src链接设为同一张图片（空白图片），将其真正的图片地址存储再img标签的自定义属性中（比如data-src）。当js监听到该图片元素进入可视窗口时，即将自定义属性中的地址存储到src属性中，达到懒加载的效果。
这样做能防止页面一次性向服务器响应大量请求导致服务器响应慢，页面卡顿或崩溃等问题。

题目五：

https://shaozhiyuan.github.io/blog/%E5%9B%BE%E7%89%87%E6%87%92%E5%8A%A0%E8%BD%BD

题目六

http://js.jirengu.com/sigiquxoji/1/edit?html,js,output