How does $(window).one('load') work, and how does it fail?

Question

As some background, I am working on building a web slider activity that fits into/extends another piece of software that outputs HTML. The key point being I have very little to no control over how the software outputs it's HTML Elements, but I can add arbitrary JavaScript and HTML elements on top of what the software outputs.

What I am trying to do is delay the loading of some images that I want to add until after all the software's outputted elements are loaded. So far I have it working by waiting to load the images until after the window load event is fired. Like so:

//-----Simplified example-----
$(document).on('ready', funciton(){
    //Some stuff to set things up
    $(window).one('load', function(){
        $('#SomeDiv').append('
            <img class= "someClass" 
            id="arbitraryImage1"
            src="folder/image1.jpg"
        ');
    });
});

Though it is working right now I'm not sure what will happen if something goes wrong. The HTML outputted by the software has a bad habit of including things that it might not need as well as occasionally not loading images on slower connections. The majority of the time if it does fail the user will not notice, so it isn't an issue. However I would like to know how $(window).one('load', function(){})behaves when a problem arises, so that I can work around the error or at least make the activity fail graciously. Any assistance or links to documentation would be appreciated, the generic-ness of 'window' and 'load' brings up a lot of irrelevant information when googling.

To summarize:

What is the behaviour of $(window).one('load', function(){}) when the window fails to load a resource (image, css, etc.)?

Answer 1

Good question. The documentation says:

The load event fires at the end of the document loading process. At this point, all of the objects in the document are in the DOM, and all the images, scripts, links and sub-frames have finished loading.

https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload

But in practice, you'll find that the load event fires after all assets queued to load when the document was originally parsed (stylesheets, external scripts, img tags) have loaded, or failed loading. As long as no requests are still pending, the fact that these assets have loaded successfully or not has no bearing on the load event being fired.

The documentation is in need of a clarification, in my opinion, as it doesn't address your question.

Answer 2

If image fails to load, then there will be just no image in your image, if it will be unable to find SomeDiv, then nothing will be appended anywhere, generally if javascript function fails to some reasons - then nothing bad will happen, just broken functionality won't work, meaning load will still be done, just console will be telling about errors