jQueryでhtml5のdata属性の値を取得

jQueryの短縮記法について。

jQueryで、ある属性にどんな値が設定されているか取得するには
このようにattr属性を使います。

<br />
&lt;a href=&quot;index.html&quot;&gt;index&lt;/a&gt;<br />

<br />
var a_href = $('a').attr('href');<br />

これが、html5でオリジナルの属性を設定できるdata属性だと
attrのままでも取得できますが
dataをつかって記述を短縮することもできます。

<br />
&lt;a href=&quot;index.html&quot; data-category=&quot;topic&quot;&gt;index&lt;/a&gt;<br />

<br />
var a_attr_category = $('a').attr('data-category');<br />
var a_category = $('a').data('category');<br />

関連記事