圖像加載如何在JavaScript中工作？

Question

這裏是圖像加載建設JS：

var img = new Image(); 
img.onload = function(){ 
    //do something 
} 
img.src = "path to image"; 

我這部作品中，分配後的字符串對象的一些事件被觸發奇特的方式。有人可以向我解釋嗎？

Answer 1

Image是一個特殊對象（在規範中稱爲主對象），其實現由瀏覽器提供。構造函數實際上返回一個新的HTMLImageElement。

在內部，src屬性具有setter函數。當您設置src時，瀏覽器開始在後臺獲取圖像。 （發生這種情況的具體機制因瀏覽器而異。）

當圖像請求成功完成時，瀏覽器觸發load事件。 （如果不成功，將觸發error事件。）

Answer 2

當您將一個字符串分配給Image對象的src屬性時，瀏覽器會發送一個來自該URL中指定的服務器的圖像請求，該請求應位於該字符串中。

當響應從具有有效映像的服務器返回時，會觸發load事件，並調用onload事件處理程序。