HTML5 Data Attributes

Have you ever looked at the HTML snippet for Twitter’s Tweet button and wondered what those data-something="loremipsum" attributes were?

<a href="https://twitter.com/share" data-count="vertical" data-via="redwall_hp">Tweet</a>
<script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>

I did too, and after a bit of Google searching, I found a post by John Resig (the creator of jQuery) that explains that they’re something called data attributes.

A new feature in HTML5, they provide a way to embed data in an element and access it from a script. (An accompanying JavaScript API makes it very easy to retrieve the data.)

HTML 5 data- Attributes [John Resig]