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

$(function() {
      function isVisible($node){
        var scrollTop = $(window).scrollTop()  //頁面滾動高度
        var windowHeight = $(window).height()  //窗口高度
        var offsetTop = $node.offset().top     // 元素位于頁面高度
        return(scrollTop + '/' + windowHeight + '/' + offsetTop)
      }

      var $container2 = $('.container2')
      console.log(isVisible($container2))
    })

題目2：當(dāng)窗口滾動時，判斷一個元素是不是出現(xiàn)在窗口可視范圍。每次出現(xiàn)都在控制臺打印 true 。用代碼實現(xiàn)

function isVisible($node){
        var scrollTop = $(window).scrollTop()  //頁面滾動高度
        var windowHeight = $(window).height()  //窗口高度
        var offsetTop = $node.offset().top     // 元素位于頁面高度
        if( offsetTop < scrollTop + windowHeight ) {
          return true
        }else {
          return false
        }
        
      }

      $(window).on('scroll', function(){
        var $container2 = $('.container2')
        console.log( isVisible( $container2 ) )
      })

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

$(function() {

      function isVisible($node){
        var scrollTop = $(window).scrollTop()  //頁面滾動高度
        var windowHeight = $(window).height()  //窗口高度
        var offsetTop = $node.offset().top     // 元素位于頁面高度
        if( offsetTop < scrollTop + windowHeight ) {
          return true
        }else {
          return false
        }
        
      }

      var clock
      $(window).on('scroll', function(){
        var $container2 = $('.container2')
        if(clock) {
          return 
        }
        if( isVisible($container2) ){
           console.log( true )
           clock = true
        }
       
      })
    })

題目4： 圖片懶加載的原理是什么？

1. 對于所有的 img 標(biāo)簽，把真實的地址放入自定義屬性data-img
2. 當(dāng)滾動頁面時，檢查頁面所有的 img 標(biāo)簽，看看這個標(biāo)簽是否出現(xiàn)到我們的視野，當(dāng)出現(xiàn)在我們的視野時，再去判斷它是否已經(jīng)加載過，如果沒有加載過，加載它

題目5： 實現(xiàn)視頻中的圖片懶加載效果
代碼