HTML5 - 数据集属性
HTML5定义了关于操作标准自定义属性的用法，以下是一个示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>元素属性</title>
</head>
<body>
<div id="app" data-name="ysw" data-id="1601140819" data-u-id="412728199707074557" data-key="00001" data-value="简单点" >
</div>
<script type="text/javascript">
let idEle = document.getElementById("app");
console.log("-----------------------");
/*
* 对于元素的非标准属性的操作的4个方法
* */
idEle.setAttribute("var1","true");
console.log(idEle);
console.log(idEle.getAttribute("var1"));
console.log(idEle.hasAttribute("var1"));
idEle.removeAttribute("var1");
console.log("-----------------------");
/*
* HTML5关于自定义属性的合法用法：数据集属性
* HTML5定义了一种标准的附加额外数据的方法，任意以"data-"开头的属性都是合法的，这些
* "数据集属性"将不会对其元素表现产生影响。
* HTML5在Element对象上定义了dataset属性，该属性值是一个DOMStringMap对象，存储了所有
* 该Element对象以data-开头的属性及其值。
* dataset.x保存了data-x属性的值，代连字符的属性对应于驼峰式命名法属性名，例如：
* data-student-name属性的访问方式为：dataset.studentName
* */
console.log(idEle.dataset);
console.log(idEle.dataset.name);
console.log(idEle.dataset.id);
console.log(idEle.dataset.uId);
console.log(idEle.dataset.key);
console.log(idEle.dataset.value);
</script>
</body>
</html>
