例
使用data-*カスタムデータを埋め込むために属性を：
<ul>
<li data-animal-type="bird">Owl</li>
<li
data-animal-type="fish">Salmon</li>
<li
data-animal-type="spider">Tarantula</li>
</ul>
»それを自分で試してみてください 定義と使用法
data-*属性は、ページまたはアプリケーションへの専用カスタムデータを格納するために使用されます。
data-*属性たちにカスタム埋め込む機能与えるdataのすべてのHTML要素の属性を。
保存されている（カスタム）のデータは、その後、（任意のAjaxの呼び出しやサーバ側のデータベースクエリなし）、より魅力的なユーザーエクスペリエンスを作成するには、ページのJavaScriptで使用することができます。
data-*属性は次の2つの部分で構成されています。
- 属性名は任意の大文字を含むべきではない、と長い接頭辞の後に、少なくとも1文字でなければなりません"data-"
- 属性値は任意の文字列を使用できます
注：接頭辞カスタム属性"data-"完全にユーザエージェントによって無視されます。
ブラウザのサポート
表中の数字は完全に属性をサポートする最初のブラウザのバージョンを指定します。
| 属性 | |||||
|---|---|---|---|---|---|
| data-* | 4.0 | 5.5 | 2.0 | 3.1 | 9.6 |
HTML 4.01とHTML5の違い
data-*属性はHTML5で新たに追加されました。
構文
<elementdata-*=" somevalue ">
属性値
| 値 | 説明 |
|---|---|
| somevalue | （文字列として）属性の値を指定します。 |
関連ページ
HTMLチュートリアル： HTML属性
HTML DOMリファレンス： HTML DOM getAttribute()メソッド