1.如何判斷一個(gè)元素是否出現(xiàn)在窗口可視范圍（瀏覽器的上邊緣和下邊緣之間，肉眼可視）。寫一個(gè)函數(shù)isVisible實(shí)現(xiàn)

function isVisible($cur){
   var winH = $(window).height(),//窗口高度
         curH = $cur.offset().top,//元素距離窗口高度
         scrollH = $(window).scrollTop()；//滾動(dòng)距離
   if (curH < scrollH + winH){
     return true;
   }else{
     return false;
   }
}

2.當(dāng)窗口滾動(dòng)時(shí)，判斷一個(gè)元素是不是出現(xiàn)在窗口可視范圍。每次出現(xiàn)都在控制臺(tái)打印 true 。用代碼實(shí)現(xiàn)

$(window).on('scroll',function(){
  isVisible($("div"));
});
function isVisible($cur){
   var winH = $(window).height(),//窗口高度
         curH = $cur.offset().top,//元素距離窗口高度
         scrollH = $(window).scrollTop()；//滾動(dòng)距離
   if (curH < scrollH + winH){
     console.log('true');
     return true;
   }else{
     return false;
   }
}

3.當(dāng)窗口滾動(dòng)時(shí)，判斷一個(gè)元素是不是出現(xiàn)在窗口可視范圍。在元素第一次出現(xiàn)時(shí)在控制臺(tái)打印 true，以后再次出現(xiàn)不做任何處理。用代碼實(shí)現(xiàn)

var isVis = false; //設(shè)置一個(gè)標(biāo)志位
$(window).on("scroll",function(){
 if(!isVis){
 isVisible($("div")); //不可見才進(jìn)入isVisible函數(shù)
 }
 else{
 return; //一旦標(biāo)志位為true，那么就不做任何處理
 }
});
function isVisible($cur){
   var winH = $(window).height(),//窗口高度
         curH = $cur.offset().top,//元素距離窗口高度
         scrollH = $(window).scrollTop()；//滾動(dòng)距離
   if (curH < scrollH + winH){
     console.log('true');
    isVis = true;//第一次出現(xiàn)就設(shè)置為true
     return true;
   }else{
     return false;
   }
}

4.圖片懶加載的原理是什么？

當(dāng)網(wǎng)頁瀏覽時(shí)出現(xiàn)很多的圖片時(shí)，特別是某些電商網(wǎng)站，如果同時(shí)全部加載會(huì)非常慢，效率低，可能會(huì)導(dǎo)致網(wǎng)頁卡死的情況，因此可以先加載網(wǎng)頁窗口可視范圍內(nèi)的圖片，其他圖片不加載，等滾動(dòng)到可視范圍內(nèi)再加載其他圖片。

• 判斷圖片是否可見：如果：屏幕滾動(dòng)的高度+窗口高度 > 圖片到頁面頂部的距離，那么該圖片即是可見的；

然后給每一個(gè)圖片的src設(shè)一個(gè)相同的初始值，這樣只會(huì)發(fā)起一次請(qǐng)求，如果不設(shè)置，可能會(huì)出現(xiàn)“X”就很難看。當(dāng)圖片是可見時(shí)，再修改圖片的src屬性，這時(shí)，圖片的內(nèi)容就能被加載出來了。