<data>：資料元素

Baseline 已廣泛支援

此功能已非常成熟，可在多種裝置和瀏覽器版本上使用。自 2017 年 10 月以來，它已在各大瀏覽器中可用。

<data> HTML 元素將給定的內容與機器可讀的翻譯關聯起來。如果內容與時間或日期相關，則必須使用 <time> 元素。

試一試

<p>New Products:</p>
<ul>
  <li><data value="398">Mini Ketchup</data></li>
  <li><data value="399">Jumbo Ketchup</data></li>
  <li><data value="400">Mega Jumbo Ketchup</data></li>
</ul>

data:hover::after {
  content: " (ID " attr(value) ")";
  font-size: 0.7em;
}

屬性

此元素的屬性包括全域性屬性。

value: 此屬性指定元素內容的機器可讀翻譯。

示例

下面的示例顯示了產品名稱，同時也為每個名稱關聯了產品編號。

html

<p>New Products</p>
<ul>
  <li><data value="398">Mini Ketchup</data></li>
  <li><data value="399">Jumbo Ketchup</data></li>
  <li><data value="400">Mega Jumbo Ketchup</data></li>
</ul>

結果

技術摘要

內容類別	流式內容、語句內容、明顯內容。
允許內容	短語內容.
標籤省略	無，起始標籤和結束標籤都必須存在。
允許父級	任何接受短語內容的元素。
隱式 ARIA 角色	`generic`
允許的 ARIA 角色	任意
DOM 介面	`HTMLDataElement`

規範

規範
HTML # the-data-element

瀏覽器相容性

另見

HTML <time> 元素。

幫助改進 MDN

瞭解如何貢獻

此頁面最後由 MDN 貢獻者於 2025 年 7 月 9 日修改。

在 GitHub 上檢視此頁面 • 報告此內容的錯誤