_JavaScript图片预加载技术_ _图片预加载优化

var imgLoad = function (url, callback) {
var img = new Image();

img.src = url;
if (img.complete) {
callback(img.width, img.height);
} else {
img.onload = function () {
callback(img.width, img.height);
img.onload = null;
};
};

};

var imgReady = function (url, callback, error) {
var width, height, intervalId, check, div,
img = new Image(),
body = document.body;

img.src = url;

/ 从缓存中读取
if (img.complete) {
return callback(img.width, img.height);
};

/ 通过占位提前获取图片头部数据
if (body) {
div = document.createElement(div);
div.style.cssText = visibility:hidden;position:absolute;left:0;top:0;width:1px;height:1px;overflow:hidden;
div.appendChild(img)
body.appendChild(div);
width = img.offsetWidth;
height = img.offsetHeight;

check = function () {
if (img.offsetWidth !== width || img.offsetHeight !== height) {
clearInterval(intervalId);
callback(img.offsetWidth, img.clientHeight);
img.onload = null;
div.innerHTML = ;
div.parentNode.removeChild(div);
};
};

intervalId = setInterval(check, 150);
};

/ 加载完毕后方式获取
img.onload = function () {
callback(img.width, img.height);
img.onload = img.onerror = null;
clearInterval(intervalId);
body && img.parentNode.removeChild(img);
};

/ 图片加载错误
img.onerror = function () {
error && error();
clearInterval(intervalId);
body && img.parentNode.removeChild(img);
};

};