如何在等待下載後立即顯示圖像

Question

下載後如何使用Javascript即時顯示圖像？

我試過Image.onload，但它一點一點地顯示圖像，大概是因爲瀏覽器正在下載它並同時渲染。

如何下載整個圖像，渲染整個圖像，然後立即顯示整個圖像？

Answer 1

創建圖像元素和負載如果第一，然後再顯示它

var image = new Image(); 
var src = '/url/to/image.png'; 

image.onload = function() { 

    var img = document.createElement('img'); 
    img.src = src; 

    document.body.appendChild(img); 

} 

img.src = src; 

if (img.complete) img.onload(); // old IE hack