Attributes and custom properties in HTML

In contrast with properties, attributes:

  • May be only strings.
  • Names not case-sensitive, because HTML attributes are not case-sensitive
  • They show up in innerHTML (unless it’s older IE)
  • You can list all attributes using an array-like attributes property of the element.

Note

Setting an attribute can synch the corresponded property automatically

Note

Setting a property doesn’t synch the corresponded attribute!

example:

<input type="text" value="markup">

input.setAttribute('value', 'new')
input.getAttribute('value')
// output: 'markup'
// return the original value!

Please read the reference!