By Sunil Agrawal


2012-03-29 05:31:37 8 Comments

I have a question about DOMAttrModified. Which changes to an HTML Element properties triggers the DOMAttrModified event (specifically interested in Firefox, but an answer that applies to other browsers might suffice too)?

I have the following test case :

        var elem = document.createElement('input');
        document.body.appendChild(elem);

        elem.id    = 'inputId';      // triggers DOMAttrModified
        elem.type  = 'text';         // triggers DOMAttrModified
        elem.value = 'inputValue';   // DOES NOT trigger DOMAttrModified
        elem.lang  = 'en';           // triggers DOMAttrModified

If I change elem.value to elem.defaultValue, then a DOMAttrModified does get triggered. Is there a comprehensive list somewhere? So far I have found HTMLInputElement's 'value' and 'checked' and HTMLOptionElement's 'selected' property not trigerring DOMAttrModified. Are there any other?

The answer at DOMAttrModified visual attributes does NOT seem to be completely correct, as 'value' is also an attribute.

Thanks, Sunil

2 comments

@jenming 2012-11-19 19:24:52

Please also note that NO DOMAttrModified events will be fired when the 'disabled' attribute is set. So if your event is not firing, that could be the reason. This also goes for the IE-only 'onPropertyChange' event.

@Sunil Agrawal 2012-11-29 01:37:54

Is that true even for the Mutation Observers, i.e. they aren't included in the mutation records? If yes, that would be a bummer.

@Boris Zbarsky 2012-03-30 10:19:08

The DOM value property doesn't change the HTML value markup attribute. The DOM defaultValue does. DOMAttrModified fires when markup attributes change, so on setAttribute/removeAttribute calls and on any property set that changes an attribute.

@Sunil Agrawal 2012-03-31 16:13:07

Thanks for the response. But my question is, is there a comprehensive list of such 'special attributes' and other 'property' that don't actually cause DOMAttrModified. So far I have found INPUT element's 'value' and 'checked', OPTION element's 'selected'. And then there are properties like 'scrollLeft' and 'scrollTop' that don't cause DOMAttrModified (understandably).

@Boris Zbarsky 2012-03-31 20:41:31

@SunilAgrawal Sure. Look in the HTML spec at the definitions of all the properties. The ones that don't say they reflect a content attribute don't have anything to do with content attributes. There's no precooked list of those, of course. And anything not defined in the HTML spec wouldn't reflect content attributes, obviously.

@Sunil Agrawal 2012-04-01 22:32:28

Just for my sake, can you please give me some examples (other than the ones I mentioned above). Just want to make sure I understand the answer :).

@Boris Zbarsky 2012-04-02 00:32:57

Start at whatwg.org/specs/web-apps/current-work/multipage/… and look at the property names; the ones that don't say they reflect content attribute don't reflect content attributes (e.g. 'accessKey', 'commandType', and the various on* properties). And then there are some that might reflect different attributes depending on the element (e.g. 'itemValue')

Related Questions

Sponsored Content

7 Answered Questions

[SOLVED] Detect changes in the DOM

7 Answered Questions

[SOLVED] Breakpoint on property change

1 Answered Questions

SVG path animation access data in firefox not working

5 Answered Questions

[SOLVED] is there an alternative to DOMAttrModified that will work in webkit

2 Answered Questions

[SOLVED] Single CSS class refuses to behave

  • 2014-02-28 19:15:40
  • Qu0rk
  • 97 View
  • 0 Score
  • 2 Answer
  • Tags:   html css firefox

1 Answered Questions

[SOLVED] DOMAttrModified visual attributes

1 Answered Questions

[SOLVED] Firefox : DOM Mutation Events for disconnected nodes?

4 Answered Questions

[SOLVED] Firefox Javascript Events Anonymous Function

Sponsored Content