自定义属性

基本概念

HTML 自定义属性通常指的是 data-* 属性，它是 HTML5 标准提供的、用于在 DOM 上存储自定义数据的方式

<div data-id="123" data-user-name="zhangsan"></div>

• 必须以 data- 开头
• 后面至少有一个字符
• 支持连字符（kebab-case）
• 值永远是 字符串

获取自定义属性

• 使用DOM属性dataset获取

const el = document.getElementById('box')

el.dataset.id            // "123"
el.dataset.userName      // "zhangsan"

• getAttribute

el.getAttribute('data-id')         // "123"
el.getAttribute('data-user-name') // "zhangsan"

修改自定义属性

只要能获取自定义属性，就可以直接对其进行更改