ROCHAS

HTML5 カスタムデータ属性「data-*」にJavaScript、jQueryからアクセスする方法

HTML5ではdata-*="value"の形式で属性名にプライベートな値を設定できるカスタムデータ属性の仕様と、そのカスタムデータ属性にJavaScriptからアクセスするAPIが定義されました。 でも実はJavaScriptだけではなく、jQueryはもちろんCSSからでもアクセスすることができるのです。 それなら私も私だけの属性作ってみたい!
ということで、今回から連載で、JavaScript、jQuery、CSSからカスタムデータ属性にアクセスする方法と、ごくごく簡単なツールチップが実装できるコンポーネントをご紹介します。