When does exactly jQuery load event fire?

Question

I have been looking here and in Google when does exactly the jQuery .load() event fire (of course I mean load event for images)? I don't mean typical situtation when document with images is loading, what I know - load event fires when we:

1/ Appending new img to document:

$('<img src="picture.jpg" />').appendTo('body');

2/ Changing the src attribute of existing image:

$('img').attr('src' , 'new_path.jpg');

3/ Creating new img object:

var object = $('<img src="picture.jpg" />');

---

But what about these situations becasue I'm not sure:

4/ Appending image to object not added to document (DOM):

var o = $('<div></div>');
o.append('<img src="picture.jpg" />');

// I mean o doesn't exist in DOM tree, it's not appended

5/ Loading content with imgs to object not added to the document:

var o = $('<div></div>');
o.load('url.html #pictures');

// I mean o doesn't exist in DOM tree, it's not appended

I would be very grateful for help...

Answer 1

For number 4, it seems to be firing only once when it's appended to the in-memory object and it doesn't fire again when appended to DOM. Check out this fiddle: http://jsfiddle.net/JxHe4/ and watch the network traffic and console output in Chrome tools or Firebug.

The behavior seems to be consistent between Chrome, Firefox and IE9. Now this answers part of your question (hopefully) but doesn't explain the reason for the behvavior. My guess is that this is the way it is specified (since all browsers behave similarly) but I can't find the specification where onLoad event is formally defined.

For number 5, I wouldn't expect load of images to be affected by loading a page, I don't know how can you get a reference to these images in the first place to attach a .Load handler to them.

[UPDATE]

This excerpt from HTML4 specification could explain the behavior in point 4: An embedded document (IMG in this case) is entirely independent of the document in which it is embedded. For instance, relative URIs within the embedded document resolve according to the base URI of the embedded document, not that of the main document. An embedded document is only rendered within another document (e.g., in a subwindow); it remains otherwise independent.