懒加载和预加载的区别（web前端之什么是懒加载）
懒加载和预加载的区别（web前端之什么是懒加载）<img class="lazy" data-original="img/bmw_m1_side.jpg"><img class="lazy" data-original="img/bmw_m1_hood.jpg"><script src="https://img.aigexing.comjquery.lazyload.js?v=1.9.1"></script>html图片调用方法为图片加入样式lazy 图片路径引用方法用data-original
懒加载技术 可以减少图片对服务器的一次性请求，做到按需加载，提升用户体验。比较代表性的解决方案有 lazyload.js ，比较主流了，不是什么秘密，像切图网这样的专业级别的前端公司，就有高频率的用这个技术。
使用方法
引用jquery和jquery.lazyload.js到你的页面
<script src="https://img.aigexing.comjquery-1.11.0.min.js"></script>
<script src="https://img.aigexing.comjquery.lazyload.js?v=1.9.1"></script>
html图片调用方法
为图片加入样式lazy 图片路径引用方法用data-original
<img class="lazy" data-original="img/bmw_m1_hood.jpg">
<img class="lazy" data-original="img/bmw_m1_side.jpg">
<img class="lazy" data-original="img/viper_1.jpg">
<img class="lazy" data-original="img/viper_corner.jpg">
<img class="lazy" data-original="img/bmw_m3_gt.jpg">
<img class="lazy" data-original="img/corvette_pitstop.jpg">
js出始化lazyload并设置图片显示方式
<script type="text/javascript" charset="utf-8">
$(function() {
$("img.lazy").lazyload({effect: "fadeIn"});
});
</script>
懒加载演示地址
http://www2.qieban.cn/jquery_lazyload/
