HTML 5 data- Attributes
A new feature being introduced in HTML 5 is the addition of custom data attributes. This is a, seemingly, bizarre addition to the specification – but actually provides a number of useful benefits.
Simply, the specification for custom data attributes states that any attribute that starts with “data-” will be treated as a storage area for private data (private in the sense that the end user can’t see it – it doesn’t affect layout or presentation).
This allows you to write valid HTML markup (passing an HTML 5 validator) while, simultaneously, embedding data within your page. A quick example:
< li class=”user” data-name=”John Resig” data-city=”Boston”
data-lang=”js” data-food=”Bacon” >
<strong>John says:</strong> <span>Hello, how are you?</span>
</li>
data-lang=”js” data-food=”Bacon” >
<strong>John says:</strong> <span>Hello, how are you?</span>
</li>
Read Original Article by John Resig
