图片延迟加载网上已经很多,我用代理模式让代码各司其职,降低其耦合性。
// myImage负责往页面中添加img标签
var myImage = (function(){
var imgNode = document.createElement('img');
document.body.appendChild(imgNode);
return {
setSrc: function(src) {
imgNode.src = src;
}
}
})();
//proxyImage负责预加载图片,并在预加载完成之后把请求交给本体myImage
var proxyImage = (function(){
var img = new Image;
img.onload = function() {
myImage.setSrc(this.src);
}
return{
setSrc: function src() {
myImage.setSrc('../loading.gif');
img.src = src;
}
}
})();
proxyImage.setSrc('../real.jpg');