Question

作为一些背景知识，我正在构建一个适合/扩展另一个输出HTML软件的Web滑块活动。关键是我几乎无法控制软件如何输出它的HTML元素，但我可以在软件输出的基础上添加任意JavaScript和HTML元素。

我想要做的是延迟加载一些我想要添加的图像，直到加载所有软件的输出元素。到目前为止，我通过等待加载图像直到窗口加载事件被触发为止。像这样：

//-----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"
        ');
    });
});

虽然它现在正在运作，但我不确定如果出现问题会发生什么。软件输出的HTML有一个坏习惯，即包含它可能不需要的东西，偶尔也不会在较慢的连接上加载图像。大部分时间如果失败，用户都不会注意到，所以这不是问题。但是，我想知道$(window).one('load', function(){})在出现问题时的行为，以便我可以解决错误或者至少使活动失败。任何帮助或文档链接将不胜感激，＆＃39;窗口的通用性＆＃39;并且＆＃39;加载＆＃39;在谷歌搜索时会显示很多无关的信息。

总结：

当窗口无法加载资源（图片，css等）时$(window).one('load', function(){})的行为是什么？

Answer 1

好问题。文档说：

加载事件在文档加载过程结束时触发。在至此，文档中的所有对象都在DOM中，而且都是图像，脚本，链接和子框架已完成加载。

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

但实际上，您会发现在最初解析文档（样式表，外部脚本，img标记）已加载或加载失败时排队加载的所有资产之后会发生加载事件。 只要没有待处理的请求，这些资产成功加载的事实与被解雇的加载事件无关。

在我看来，文档需要澄清，因为它没有解决您的问题。

Answer 2

如果图像无法加载，那么图像中将没有图像，如果它无法找到SomeDiv，那么任何地方都不会附加任何内容，通常如果javascript函数因某些原因失败 - 那么什么都不会发生，只是破碎的功能不起作用，意味着仍然会完成加载，只是控制台会告诉错误

$（window）.one（＆＃39; load＆＃39;）如何工作，以及它如何失败？

2 个答案: