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

function isVisible($node) {
    var $winHeight = $(window).height();
    var $nodeHeight = $node.outerHeight();
    var $offsetTop = $node.offset().top;
    var $scrollTop = $(window).scrollTop(); 
    if ($winHeight + $scrollTop > $offsetTop && $scrollTop < $offsetTop + $nodeHeight) 
    {
        console.log('true');
        return true;
    }
    else 
    {
        console.log('false');
        return false;
    }
}

2.當窗口滾動時，判斷一個元素是不是出現在窗口可視范圍。每次出現都在控制臺打印 true 。用代碼實現

var flag = ture;
$(window).scroll(funtion() {
    isVisible($node);
});

function isVisible($node) {
    var $winHeight = $(window).height();
    var $nodeHeight = $node.outerHeight();
    var $offsetTop = $node.offset().top;
    var $scrollTop = $(window).scrollTop(); 
    if ($winHeight + $scrollTop > $offsetTop && $scrollTop < $offsetTop + $nodeHeight) 
    {
        if(flag)
        {
            console.log('true');
            flag = false;
        }
        return;
    }
    else 
    {
        flag = true;
    }
}

3.當窗口滾動時，判斷一個元素是不是出現在窗口可視范圍。在元素第一次出現時在控制臺打印 true，以后再次出現不做任何處理。用代碼實現

var flag = ture;
$(window).scroll(funtion() {
    isVisible($node);
});

function isVisible($node) {
    var $winHeight = $(window).height();
    var $nodeHeight = $node.outerHeight();
    var $offsetTop = $node.offset().top;
    var $scrollTop = $(window).scrollTop(); 
    if ($winHeight + $scrollTop > $offsetTop && $scrollTop < $offsetTop + $nodeHeight) 
    {
        if(flag)
        {
            console.log('true');
            flag = false;
        }
        return;
    }
}

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

當訪問一個頁面的時候，先把img元素或是其他元素的背景圖片路徑替換成一張空白圖片路徑，只有當圖片出現在瀏覽器的可視區域內時，才為它設置真正的路徑，讓圖片顯示出來。以此降低同一時間的網絡請求。