zoukankan      html  css  js  c++  java
  • 懒加载预加载(图片)

    懒加载:只显示当前所能看到的页面的内容,这样做的好处可以减少服务器的压力,当页面继续往下拉的时候,再继续加载内容。

    预加载:一般用于图片加载,预先加载图片,还可以预先判断图片是否加载成功,如果加载不成功,可以使用本地图片替换,这样也能达到美观的效果.

    懒加载的主要代码:if(imgHeight < document.documentElement.clientHeight + document.documentElement.scrollTop){   //这里写要执行的函数 }

    预加载的主要代码:

    var temp_img = new Image()

    temp_img.src = img_url +img.dataset.src;

    temp_img.onload = function(){//这是加载成功的情况

    img.src = img_url + img.dataset.src;

    }

    //加载失败的情况

    temp_img.onerror = function(){

    img.src = 'img/0.jpg';

    }

    说明:dataset是自定义属性,保存真正的img地址,img_url是图片静态地址。

     
     
  • 相关阅读:
    面向对象编程
    面向对象编程进阶
    pycharm常用快捷键
    面向对象
    深拷贝和浅拷贝
    hashlib模块
    日志配置
    常用模块大全
    正则详解
    软件目录规范
  • 原文地址:https://www.cnblogs.com/ZM-ONE/p/8516392.html
Copyright © 2011-2022 走看看