window.stop(） 停止当前加载图像，但加载新图像

window.stop() to stop currently loading images, but load new images

本文关键字：图像 加载 新图像 stop window      更新时间：2023-09-26

我有一个脚本，它基于某些事件（用户交互，setTimeout），加载一个JSON，并使用JSON的结果加载一堆图像。我还根据用户与页面的交互预加载了一些图像。有时，在页面打开一段时间后，从 JSON 加载的图像开始"变慢"，加载时间更长（如果我刷新页面，它们加载正常）。所以我开始寻找一种中止当前加载图像的方法，并遇到了"window.stop（）"。我阅读了规范中MDN amd中的描述，无法理解这是否是我正在寻找的。

MDN有：

stop（） 方法完全等效于单击浏览器。由于脚本的加载顺序，因此stop（） 方法无法从 停止包含它的文档加载，但它会停止加载大图像、新窗口、以及加载延迟的其他对象。

规格：

窗口对象上的 stop（） 方法应该，如果存在现有的尝试浏览上下文，但该尝试不是当前正在运行卸载文档算法，取消该算法导航;然后，它必须中止浏览的活动文档在其上调用它的 Window 对象的上下文。

并中止文档具有

。在此上下文中取消提取算法的任何实例记录，丢弃排队等待它们的任何任务，并丢弃任何从网络收到的更多数据...

这是否意味着在使用 window.stop（） 后我无法再加载任何图像？我做了一些测试，在Firefox，Chrome和Safari上，这似乎有效（图像在window.stop之后加载），但这似乎与规范相矛盾。

window.stop();
document.getElementById("c").innerHTML = "<img src='http://a5.mzstatic.com/us/r30/Purple5/v4/5a/2e/e9/5a2ee9b3-8f0e-4f8b-4043-dd3e3ea29766/icon128-2x.png'/>";
<div id="c"></div>

我

是否误读了规范，使用这种代码是安全的，还是我应该尝试以不同的方式进行？

这是同步调用。 在代码中，window.stop()运行，之后加载新图像。 规格也很好。.

document.getElementById("c").innerHTML = "<img src='//test.com/THIS_WILL_STOP_LOADING.png'/>";
window.stop();
document.getElementById("d").innerHTML = "<img src='//test.com/THIS_WILL_LOAD.png'/>";

你需要做 

return window.stop();

因为具有window.stop();的脚本已经加载，所以它将通过最后。

如果之后有另一个脚本，它将被停止，请看示例：

<div id="c"></div>
<script>window.stop(); </script>
<script>document.getElementById("c").innerHTML = "<img src='http://a5.mzstatic.com/us/r30/Purple5/v4/5a/2e/e9/5a2ee9b3-8f0e-4f8b-4043-dd3e3ea29766/icon128-2x.png'/>";</script>

相关文章：