js圖片預先載入簡單範例
function loadImage( url, callback) {
if(url!='null') {
var img = new Image();
.complete) {
callback(img);
} else {
img.onload = null;
}
}
}
loadImage(pic_url,loadImage);
另一個詳細詳解範例
另一個詳細詳解範例
透過js操縱DOM很多情況下都是為了實現和當前頁html元素的非同步載入，我談談對Image物件的一些認識。
看範例：
當包含上述程式碼的「頁開啟」時並未載入上述程式碼的「包含」 tt.jpg” ，點擊按鈕時候才載入。當載入完成後觸發onload事件顯示到頁面上。
如果你是第一次載入 “tt.jpg" 這張圖片的話，運作正常。點擊按鈕載入並顯示一張圖片，如果重複點擊會怎麼樣呢？
IE、Opera中，除了第一次載入 圖片時候顯示正常，之後再點擊就沒有反應了，刷新也一樣。難道它們只觸發一次 」onload「 事件？是快取機制？
FF、Chrom中，每點擊一次載入一張該圖片。
稍微修改下：
運行後發現，奇怪的事情發生了。所有的瀏覽器都一致了，都是每點擊一次載入一張圖片。這又是什麼原因？
由此可以見 IE、Opera 執行過程中並不是只觸發一次 onload 事件！
聯想一下Image 物件的一些屬性看看，complete、readyState(IE專屬值[uninitialized,complete]) （為防止快取影響效果請更換圖片名稱！）
複製程式碼
