Detect if objects are loaded [Javascript]

问题

I was wondering, is there a way to detect if a certain image / div is loaded? For example when i am loading two heavy images and showing a loading sign at the two places the images will later occupy, is there a way to already display the first image when it's loaded while still loading the second one?

回答1:

myImage.addEventListener('load', function() { ... }, false);

Code inside the above function will be called when the image is finished loading.

回答2:

If you are using new Image to preload images, then you can do the following to be notified of then it is loaded

var img = new Image();
img.onload = function() {
    //display the image
    document.getElementById("myDiv").innerHTML = "%3Cimg src='myimg.jpg' alt=''/%3E";
};
img.src = "myimg.jpg";

Remember to set the src after the onload.

回答3:

if an image is done loading, its .complete property switches to true.

来源：https://stackoverflow.com/questions/2896126/detect-if-objects-are-loaded-javascript