HTML5 カスタムデータ属性

ウェブアプリケーションでは独自の属性を使用できると便利な状況がよくあります。
HTML5ではこうしたニーズに答えるべくカスタムデータ属性というものが利用できるようになりました。

カスタムデータを定義するには「data-」というプレフィックスを持つ属性を加えるだけです。
下記はTweetボタンのソースの一部です。

<div id="widget">
  <div class="btn-o" data-scribe="component:button">
    <a href="https://twitter.com/intent/tweet〜" class="btn" id="b">
      <span class="label" id="l">ツイート</span>
    </a>
  </div>
  <div class="count-o enabled" id="c" data-scribe="component:count">
    <a aria-describedby="count-desc" title="このページは1回共有されました。
    これらのツイートを見る。 "
    href="http://twitter.com/search?q=http%3A%2F%2Fphantom37383.blog.fc2.com%2F"
    id="count">1</a>
  </div>
</div>