I have a webpage with an external javascript library, and my own extra code. The external library can't be change. It manipulates dom elements, adds new ones, changes attributes (e.g. src on some <img> nodes, etc.). I am using jQuery. Is there any event handler that is fired when the value of an attribute changes of a node?

i.e. is there anyway I can detect (in jQuery) when the src of an <img> is changed (by someone else?)

I have a webpage with an external javascript library, and my own extra code. The external library can't be change. It manipulates dom elements, adds new ones, changes attributes (e.g. src on some <img> nodes, etc.). I am using jQuery. Is there any event handler that is fired when the value of an attribute changes of a node?

i.e. is there anyway I can detect (in jQuery) when the src of an <img> is changed (by someone else?)

• javascript
• jquery
• dom-events

2 Answers 2

You can go for the jQuery watch plugin to detect changes in the attributes.

Check out this post too:

http://darcyclarke.me/development/detect-attribute-changes-with-jquery/

If you just need to know when the source of an image changes, you just need to add an onload handler to the image. When the image loads, it will fire the event.

$("img").load( function(){ alert('loaded'); } );