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

function isVisible($node){
var $nodeH=$node.offset( ).Top,
      $windowH=$(window).height( ),
      $scrollH=$(window).scrollTop( ）;
if($nodeH < ($windowH+$scrollH) && $nodeH>$scrollH){
           return true; }
    else{
        return fales;
    }

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

$(window).on('scroll',function( ){
    var $scrollH=$(this).scrollTop( );
    function isVisible($node){
    var $nodeH=$node.offset( ).Top,
      $windowH=$(window).height( );
if($nodeH < ($windowH+$scrollH) && $nodeH>$scrollH){
           return console.log( 'true' ); }
    else{
        return console.log( 'false' );
    }
})

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

$(window).on('scroll',function( ){
    var $scrollH=$(this).scrollTop( );
    function isVisible($node){
    var $nodeH=$node.offset( ).Top,
      $windowH=$(window).height( );
if($nodeH < ($windowH+$scrollH) && $nodeH>$scrollH){
        if(!isload( )){
        return console.log( 'true' );
        $node.attr('data-load','true')
 }else{
      return;
    }
})

function  isload( ){
    return $node.attr('data-load');
}

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

將圖片的src屬性值先不設(shè)置，而是放在一個(gè)自定義屬性內(nèi)。當(dāng)圖片位置達(dá)到相關(guān)需求時(shí)（一般為在瀏覽器中出現(xiàn)），再來添加src屬性值，達(dá)到圖片出現(xiàn)的方法。主要目的是為了減少同時(shí)加載多張圖片的壓力，有需求在加載，優(yōu)惠網(wǎng)頁(yè)性能。