Javascript Attributes vs Properties

From Zanecorpwiki

In general, attributes and properties have no set definition. That is, there is no formal distinction between the two in OOP. In terms of HTML and Javascript, there is a clear functional difference between the two.

Attributes are things set in the HTML. AFAIK the attribute always sets the initial value of the associated property. Attributes generally shouldn't change.

Properties are available via Javascript and do change. So:

<input id="foo" type="text" name="foo" value="bar" />

Sets the attribute 'value' and the initial value of property 'value' to 'bar'.

document.getElementById('foo').value = 'baz';

Sets the property, but not the attribute of input 'foo' to 'baz'. The attribute 'value' should still be 'bar'.

HOWEVER don't rely on this distinction. This is an area where IE is very buggy and if the distinction is more than academic, you'll just have to test how each supported browser responds.

See also Styling via JavaScript for special considerations when manipulating the style attribute.