javascript - Javascript停止图像加载

Question

我正在制作一个网站，其中一个页面正在使用来自外部网站的 javascript 文件

该外部 js 包含（实际上加载）我的页面上不需要的图像。

如何停止加载该图像（假设 img url 是“http://image.com/img.png”）？是否有任何javascript代码可以做到这一点？

感谢大家

Answer 1

加载 DOM 后，停止下载任何资源（window.stop()对于现代浏览器，document.execCommand("Stop", false)对于 IE）。然后找到您需要的资源并要求浏览器下载它们。

Answer 2

您可以选择带有 URL 的图像并将其从 DOM 中删除

$(document).ready(function(){
    $('img[src="http://image.com/img.png"]').remove();
});

更新1：

由于您可能想要部分匹配，请试试这个：

$(document).ready(function(){
   $('img[src*="image.com/img.png"]').remove(); 
});

Answer 3

您不能使用 JavaScript 取消单个资源的下载。正如@nkamm 回答的那样，您可以调用该window.stop()方法，但随后它会停止下载任何资源（例如按下浏览器中的“停止”按钮）。

如果您尝试停止下载的图像不会在 DOM 中呈现，是否值得取消页面中的所有其他下载？

Answer 4

完全控制它的唯一方法是 WebWorkers。

基本上，您创建一个 xhr.worker.js，它只有一个 HTTP 请求来加载图像（通过消息接收 URL）。

在他加载图像后，图像将在浏览器缓存中，因此您只需将 src='' 设置为图像 URL 即可显示它。

如果你杀死特定的 webworker，图像加载也会被取消！

Answer 5

$(window).load(function(){
    $('img[src="http://image.com/img.png"]').remove();
});