怠惰負荷に関する問題

1:ウィンドウの表示範囲(ブラウザの上端と下端の間、肉眼で表示)に要素が表示されているかどうかを判断する方法.関数isVisible実装を書く

 function isVisible ($node) {
        var scrollTop = $(window).scrollTop();
        var windowHeight = $(window).height();
        var targetOffsetTop = $node.offset().top;
        
        if (targetOffsetTop < (scrollTop + windowHeight) && targetOffsetTop > scrollTop) {
            return true;
        }
        return false;
    }

2.ウィンドウがスクロールすると、1つの要素がウィンドウの可視範囲に現れるかどうかを判断します.表示されるたびにコンソールにtrueを印刷します.コードで実現

    //$node     

    $(window).on('scroll',function () {
        if (isVisible($node)) {
            console.log(true);
        }
    });

    function isVisible($node){
        var scrollTop = $(window).scrollTop()
        var windowHeight = $(window).height()
        var offsetTop = $node.offset().top

        if(offsetTop < scrollTop + windowHeight && offsetTop > scrollTop){
            return true
        }
        return false
    }

3,ウィンドウがスクロールする時、1つの要素がウィンドウの可視範囲に現れるかどうかを判断する.エレメントが最初に表示されるとコンソールにtrueが印刷され、その後は処理されません.コードで実現

 //$node     
    function checkshow ($node) {
        var windowHeight = $(window).height();
        var scrollTop = $(window).scrollTop();
        var nodeOffsetTop = $node.offset().top;

        if (nodeOffsetTop < (windowHeight + scrollTop) &&　nodeOffsetTop > scrollTop) {
            return true;
        }
        else {
            return false;
        }
    }
    function firstShow ($node) {
        $node.data('hasShowed',false); //                     
        if (checkshow($node)) {
            if (!$node.data('hasShowed')) { //     false
                $node.data('hasShowed',true);
                console.log(true);
            }
        }
    }

4、写真の怠惰なロードの原理は何ですか?
複数のピクチャがあるサイトでは、アクセス時にすべてのピクチャを直接ロードするのではなく、ブラウザウィンドウ内のピクチャのみをロードする必要があります.スクロールすると、より多くの画像がロードされます.画像という怠け者のロード.
imgに新しい属性をカスタマイズすることで、ピクチャの実際のsrcアドレスを格納し、ロードが必要な場合、この実際のアドレスをsrcに割り当ててピクチャロードを行うことができます.
全体的な考え方:
大体の考え方は

は、実際のアドレス

を格納するためにdata-src(属性をカスタマイズ)を設定する.

ページをスクロールすると、すべてのimgラベルをチェックして、視野に現れているかどうかを確認し、視野に現れている場合は、ロードされているかどうかを判断し続け、まだロードされていない場合はロードします.