Question: I was told it is necessary to set the `onload` function before setting `src` for an image object. I've [searched in SO](https://stackoverflow.com/search?q=image%20src%20onload) for this.

I found this code:

```
var img = new Image();
img.src = 'image.jpg';
img.onload = function () {
    document.body.appendChild(img);
};

```

But most people believe that `onload` should be written before `src` like this:

```
var img = new Image();
img.onload = function () {
    document.body.appendChild(img);
};
img.src = 'image.jpg';

```

**MUST** it be written in this order? Are there any cases when the above code will cause an error (like if an image is too big)?

If you anyone can show me some examples, I will be very appreciate.

Answer: 
It doesn't have to, but if setting the `src` and the image loads before your handler is attached, it won't fire.

JavaScript operates asynchronously. Setting the `src` will cause the web browser to load the image outside the main execution flow. If `onload` isn't set at the time that operation completes - which could be between setting `src` and `onload`.
The browser will start downloading the image asychronously as soon as you assign a src, so there is the possibility the download could complete before you attach the onload event handler and never fire the code to add the image to the DOM.