如何判断一个元素是否出现在窗口可视范围（浏览器的上边缘和下边缘之间，肉眼可视）。写一个函数 isVisible实现
function isVisible($node) {
var winHeight = $(window).height();
var scrHeight = $(window).scrollTop();
if ($node.offset().top > scrHeight && $node.offset().top < (scrHeight + winHeight)){
console.log("在可视范围内");
}
}
当窗口滚动时，判断一个元素是不是出现在窗口可视范围。每次出现都在控制台打印 true 。用代码实现
function isVisible($node) {
var winHeight = $(window).height();
var scrHeight = $(window).scrollTop();
if ($node.offset().top > scrHeight && $node.offset().top < (scrHeight + winHeight)){
console.log("ture");
}
}
$(window).on("scroll",function(){
isVisible($(node));
});
当窗口滚动时，判断一个元素是不是出现在窗口可视范围。在元素第一次出现时在控制台打印 true，以后再次出现不做任何处理。用代码实现
function isVisible($node) {
var winHeight = $(window).height();
var scrHeight = $(window).scrollTop();
if ($node.offset().top > scrHeight && $node.offset().top < (scrHeight + winHeight)){
if ($node.data('loaded') !== 1){
$node.data('loaded',1);
console.log("ture");
}
}
}
$(window).on("scroll",function(){
isVisible($node);
});
图片懒加载的原理是什么？
懒加载的原理就是先判定元素是否在浏览器窗口可视范围内，如果不在可视范围内则不进行http请求，如果在可视范围内并且没有加载过，则进行http请求(将事先写在标签中的自定义属性“data-src”的值赋给元素所在标签的src属性。)
