为什么页面上已加载的图像会再次加载？

Question

我正在使用

删除并替换dom中图像的src

$('.myImg').attr('src',imgURL);

我正在尝试将此与on load事件一起使用。我预计只有在页面上还没有加载imgURL时才会触发加载事件。

相反，有时会触发加载事件。我可以看到，在Chrome网络选项卡中，图像以304 Not Modified状态返回。

我知道如何解决这个问题，但我很好奇这是否正常。

我想说出这个问题的最好方法是什么会导致浏览器再次尝试加载已经加载到页面上的图像？有一个缓存杀手，但是在我再次显示图像之前它没有被更新。

Answer 1

304不是某种诫命，“永远不要再加载这个！”。这只是对客户端缓存系统的一个建议，即不需要重新加载。基于它的内部算法，自然会在不同的实现中有所不同，它可能会选择加载资源。

Answer 2

尝试使用

$(window).load(function () {
  // run code
});

只有在加载了dom树和图形时才会触发该功能。

Answer 3

问题最终是我在开发人员工具中检查了“禁用缓存”： - ）