HTML data set
data set目的是在標籤中預先設置資料讓javascript抓取 或替代id和class 讓屬性id和class給css使用 data-id給javascript使用 增加可讀性
有時class和id是設計使用 這時工程師就可以用data-替要抓取dom取名稱
如此雙方都不會影響到各自的取名規則
在html的任何屬標籤(<div>,<a>,<h1>......)屬性(attributes)設置data-開頭的名稱
HTML代碼
<p id="artice" data-id="testdiv" data-type="articecontent" data-content="超文件標示語言（英語：HyperText Markup Language，簡稱：HTML）
是一種用於建立網頁的標準標示語言。
HTML是一種基礎技術，常與CSS、JavaScript一起被眾多網站用於設計令人賞心悅目的網頁、網頁應用程式以及行動應用程式的使用者介面。">
</p>
CSS代碼
#artice{
color:red;
}
javascript代碼
window.onload=function()
{
var articeobj=document.querySelector("p[data-type='articecontent']");
articeobj.textContent=articeobj.dataset.content;
}