javascript取消图像加载

我在查找使用javascript取消图像加载的方法。我看过其他问题并隐藏它们是不够的。此外，页面的其余部分必须加载（window.stop（）不存在问题）。javascript取消图像加载

正在加载的页面不在我的控制之下，只有一件事是有保证的 - 页面上的第一个<script>是我的JavaScript（轻量级 - 没有jquery）。

我试过将所有img源设置为空，但这并没有帮助，因为dom是在页面解析后创建的，所有浏览器都有相同的行为 - img在解析后加载。

来源

2012-12-25 daniel_or_else

@约翰“我已经尝试设置所有IMG来源落空，页面解析后没有帮助，因为在创建DOM和所有的浏览器有同样的行为 - img在被解析后加载“ – thescientist

请参阅：http://stackoverflow.com/questions/4926215/cancel-single-image-request-in-html5-browsers :-) –

嗨，John。已经看过这个答案，但是，如果我没有正确地说明，为了有一个隐藏的iframe，我必须控制源代码html –

不可以使用现代浏览器。即使你用JavaScript浏览器仍然坚持加载图像来改变图像标签的src属性。我从开发Lazy Load plugin知道这一点。

来源

2012-12-25 15:27:05

回顾onload event：

window.onload=function(){ 
imgs = document.getElementsByTagName('img'); 

for(i = 0; i < imgs.length(); i++){ 
imgs[i].src = '#'; 
} 
};

来源

2012-12-25 14:05:07 SaidbakR

并且这是如何阻止图像加载的？ – mplungjan

@mplungjan这会产生同样的效果。我想他想在页面中不渲染图像。 – SaidbakR

是的，你的代码将不会踢，直到所有图像加载后 – mplungjan

你需要一个代理。

脚本可以使用像

location.replace('http://yourserver.com/rewrite/php?url='+escape(this.href));

东西也许你能告诉我们你为什么要取消图像加载，其网站要加载的，所以我们可以想出一个更好的解决方案重定向到另一台服务器

如果没有什么比其他图像在页面上，你可以尝试

document.write('<base href="http://yourserver.com/" />');

这会搞乱所有非绝对SRC和HREF中的页面上。

UPDATE可怕的技巧，但也许这几乎是伪代码（我去睡觉）会做些事情

document.write('<script src="jquery.js"></script><div id="myDiv"></div><!-'+'-'); 
$(function() { 
    $.get(location.href,function(data) { 
    $("#myDiv").html(data.replace(/src=/g,'xsrc=')); 
    }); 
})

来源

2012-12-25 14:12:06 mplungjan

它踢得够快吗？ –

它可能会在任何图像加载之前踢 – mplungjan

嗨，我正在开发一个正在由客户端网站使用的产品。其中一个要求是，它不能从客户端网站的角度来看是“侵入式”的。因此，该产品使用javascript（这是该产品要连接的页面必须添加的唯一东西）进行连接，并且会攻击原始页面。我们的一些客户虽然热衷于注意到原始图像仍然加载，并且我在这里... –

如果你想只取消图像的加载，你可以使用sємsєм的解决方案但我不认为它会通过使用窗口onload事件工作。

您可能需要提供一个按钮来取消图像加载。同时我建议，而不是设置src属性为“＃”，即可删除使用 的removeAttribute（）

src属性本身，[确保您禁用缓存在测试]

来源

2012-12-25 14:20:19

刚刚尝试removeAttribute（），图像仍然加载... –

我可以看到停止图像加载的唯一方法就是不要有一个src图像本身的当前属性，并使用自定义data-*属性来保持图像的位置：

<img data-src="http://path.to/image.png" />

显然，这不正常降级的那些（诚然少见）禁用JavaScript的浏览器，因此需要一个noscript回退：

<img data-src="http://path.to/image.png" /> 
<noscript><img src="http://path.to/image.png" /></noscript>

而且还有一点，一个简单的函数加载图像时，你或你的U已准备就绪：

/* simple demo */ 
function imagePopulate(within, attr) { 
    within = within && within.nodeType == 1 ? within : document; 
    attr = attr || 'data-src'; 
    var images = within.getElementsByTagName('img'); 
    for (var i = 0, len = images.length; i < len; i++) { 
     if (images[i].parentNode.tagName.toLowerCase() !== 'noscript') { 
      images[i].src = images[i].getAttribute(attr); 
     } 
    } 
} 

document.getElementById('addImages').onclick = function(){ 
    imagePopulate(); 
};

JS Fiddle demo。

我不能代表所有浏览器可以肯定的，但这似乎在Chrome中工作（在没有尝试，从观察的开发工具的网络选项卡上，加载noscript -contained img）。

来源

2012-12-25 15:50:14

再次，没有控制HTML，只有JavaScript –

它可以与网络工作者完成。请参阅以下示例： https://github.com/NathanWalker/ng2-image-lazy-load。

停止网络工作者取消在浏览器中的图像加载

来源

2018-02-06 09:17:29 teter

javascript取消图像加载

回答

相关问题