<data>: DATA 要素
最終更新：2026-10-13
<data>DATA 要素
表示テキストを機械可読な値と関連付けます（例：商品名と価格やコード）。ブラウザーはテキストのみ表示し、スクリプトが value を読めます。
| カテゴリ | テキスト内容 |
|---|---|
| コンテンツモデル | フローコンテンツ |
| 許可される親要素 | フローコンテンツを受け入れる要素 |
| 閉じタグ | 必要 </data> タグ |
| ステータス | 標準 |
📝 構文
<data value="598">$598</data>⚙️ 属性
この要素はグローバル属性に加え、以下の属性をサポートします：
| 属性 | 値 | 説明 |
|---|---|---|
value | The machine-readable value; the text is still shown as-is. |
▶ サンプル
下のコードを編集して、playground でリアルタイム結果を確認：
🌐 ブラウザサポート
| ブラウザ |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| <data> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| すべての主要ブラウザでサポート | |||||
ヒント： 日時関連の値には、意味論の面から <data> より <time> を使うのが推奨です。
❓ よくある質問
Qdata タグは何に使うものですか？
A
<data> は「人が読む内容」と「機械が読む値」を結び付けます。内容はタグの中に、機械用の値は value 属性に置きます。たとえば <data value='20261009'>10月9日</data> のように書くと、スクリプトやクローラーは正規化された値を受け取れます。Qdata と time の違いは何ですか？
A分担が明確です。日時は
<time>（datetime の形式は ISO 8601 に限定）；それ以外の任意のデータ（番号・数量・座標・ID など）は <data> で、value の形式は自由です。どちらも「表示とデータの分離」を実現します。Qdata タグの value 属性は必須ですか？
A必須です。
<data> は value 属性がなければ存在意義がありません（仕様も value を必須としています）。機械可読な値が不要なら、プレーンテキストをそのまま書けば十分です。機械可読にしたいのに適切な value がない場合は、hidden フィールドや data-* カスタム属性を検討しましょう。🏷️ 関連タグ
💡 関連ケース
今後さらにケーススタディを追加予定です。
📚 関連チュートリアル
