I thought I had this down, but then it turns out - only sometimes.
Looking at jQuery docs for prop
Nevertheless, the most important concept to remember about the checked attribute is that it does not correspond to the checked property. The attribute actually corresponds to the defaultChecked property and should be used only to set the initial value of the checkbox.
This lead me to believe that attributes are the html element attributes, whereas properties are DOM node properties. If so, modifying the page through user interaction will update properties but never attributes. And likewise, making changes to properties will always make corresponding changes in what is displayed, while settings attributes will not necessarily create changes on screen.
Then, a little further up on the same page
$( elem ).attr( "checked" ) (1.6) "checked" (String) Initial state of the checkbox; does not change
$( elem ).attr( "checked" ) (1.6.1+) "checked" (String) Will change with checkbox state
$( elem ).attr( "checked" ) (pre-1.6) true (Boolean) Changed with checkbox state
They seem to have gone from not respecting this (pre 1.6) to respecting it (1.6) to not respecting it again, while at least keeping the attribute value in line with what it should be (1.6.1+). So, now an attribute is a property-attribute?
Either way, the reason I'm asking is that I needed to be able to set the current state values of some elements class and style. Let's say these elements had class="A B C" and I needed to set class="A". They also had style="width: 230px; other: stuff;" which I needed to set to style="".
That is, after the changes they should all have nothing affecting their current styling except that from class A as defined in stylesheets.
As I understood it, this would be done with
This works in FF. It does not work in Chrome or Safari. As soon as I realized these elements retained their class and style values (properties?), I tried switching to
which works in all three browsers. But… but… why would changing those values affect the DOM properties while setting the DOM properties does not affect DOM properties?
What am I missing?