当<img/>标记的currentSrc发生更改时，是否触发了Javascript事件？

Question

假设我有一个<img>标记：

<img id="my_tag" src="/default.jpg" srcset="/small.jpg 500w, /medium.jpg 1000w, /large.jpg 2000w">

当我加载页面时，Javascript可以告诉我它正在使用哪个srcset：

document.getElementById("my_tag").currentSrc

如何检测currentSrc何时更改并触发事件？

避免“重复”的呼喊！我可以确认使用DOM MutationObserver code here，使用jQuery observe或使用onload事件在Chrome中触发它：

var my_tag = document.getElementById("my_tag");
my_tag.onload = function(){
    alert("CHANGED");
    console.log( "Src changed to " + my_tag.currentSrc );
};

我认为这是因为当使用srcset时，当currentSrc发生变化时，它似乎不会更新DOM。

Answer 1

您可以使用＆＃39; onload＆＃39;图像事件：

var my_tag = document.getElementById("my_tag");
my_tag.onload = function(){
    console.log( "Src changed to " + my_tag.currentSrc );
}

Cross-browser image onload event handling

上的相关帖子