01常用算法：用jq实现当某元素进入视口时方能显示

$(window).scroll(function() {
    //#your-element是本次要操作元素的id号

    //elementTop表示该元素 顶部 相对于文档顶部的垂直偏移量
    var elementTop = $('#your-element').offset().top;

    //elementBottom表示该元素 底部 相对于文档顶部的垂直偏移量
    var elementBottom = elementTop + $('#your-element').outerHeight();

    //viewportTop表示视口 顶部 相对于文档顶部的垂直偏移量
    var viewportTop = $(window).scrollTop();

    //viewportBottom表示视口 底部 相对于文档顶部的垂直偏移量
    var viewportBottom = viewportTop + $(window).height();

    //如果该元素 底部 相对于文档顶部的垂直偏移量  大于
    //视口 顶部 相对于文档顶部的垂直偏移量 且小于
    //视口 底部 相对于文档顶部的垂直偏移量
    //那说明它已经出现在视口范围
    if (elementBottom > viewportTop && elementTop < viewportBottom) {
        // 元素已经进入视口范围，执行加载操作
        $('#your-element').show(); // 替换为您要加载的元素的选择器，并显示该元素
    }
});