1 //定义预加载图片列表的函数(有参数) 2 jQuery.preloadImages = function(){ 3 //遍历图片 4 for(var i = 0; i<arguments.length; i++){ 5 jQuery("<img>").attr("src", arguments[i]); 6 } 7 } 8 // 你可以这样使用预加载函数 9 $.preloadImages("images/logo.png", "images/logo-face.png", "images/mission.png");
我可以用预加载的方法，做一些单页面图片量比较大的网站，比如一些电商网站，如果一次性加载所有图片，会影响加载速度，这样会造成用户体验很差。
我们可以用上面的预加载函数处理这个问题。
逻辑：
1.首次加载页面，传入一部分参数（这里的参数就是图片路径）；
2.当窗口视图滑动到上次加载的最后一张图片时，再传入另一部分参数；
3.这样反复传递参数，只要用户窗口视图到达上一次传入图片的最后时，就传递下一次要加载的参数；
4.这样就不会造成不必要的资源浪费（没必要一次性加载所有图片，有可能用户不会浏览所有图片）；