"DOMAttrModified" event not supported by modern browser?

Question

Here are the codes (Jsfiddle demo) :

<a href="#">Click me!</a>

<script>
var a = document.body.children[0]

a.onclick = function() {
  alert('in onlick')
  this.setAttribute('href', 'lala')
  alert('out onclick')
  return false
}

function onpropchange() {
  alert('onpropchange')
}

if (a.addEventListener) { // FF, Opera
  a.addEventListener('DOMAttrModified', onpropchange, false)
}
if (a.attachEvent) { // IE 
  a.attachEvent('onpropertychange', onpropchange)
} 
</script>

When the <a href>Click me!</a> is clicked. The alert('onpropchange') is not executed.. (I'm using Chrome 43.0) Does anyone have any ideas about this?

Use the modern [```MutationObserver```](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver) An example can be found at http://stackoverflow.com/questions/17709726/how-to-dynamically-change-classes-when-div-width-changes/17710809#17710809 — Xotic750, Jun 02 '15 at 06:12

score 2 · Accepted Answer · answered Jun 02 '15 at 06:04

From the docs of mutation events

This feature has been removed from the Web. Though some browsers may still support it, it is in the process of being dropped. Do not use it in old or new projects. Pages or Web apps using it may break at any time.

Use mutationObserver instead if possible.

"DOMAttrModified" event not supported by modern browser?

1 Answers1