用于向某些元素添加自定义属性的Javascript

在JavaScript中，可以使用data-*属性为HTML元素添加自定义属性。data-*属性用于存储页面或应用程序的私有自定义数据。这些属性可以在HTML文档中存储任意数据，并且不会影响页面的显示。

例如，可以使用data-*属性为一个<div>元素添加自定义属性：

<div id="myDiv" data-custom-attribute="customValue">Hello World</div>

在JavaScript中，可以使用HTMLElement.dataset属性来访问data-*属性的值。例如，可以使用以下代码获取上面<div>元素的自定义属性：

const myDiv = document.getElementById('myDiv');
const customAttribute = myDiv.dataset.customAttribute;
console.log(customAttribute); // 输出 "customValue"

使用HTMLElement.dataset属性，可以方便地在JavaScript中访问和修改data-*属性的值。例如，可以使用以下代码修改上面<div>元素的自定义属性：

const myDiv = document.getElementById('myDiv');
myDiv.dataset.customAttribute = 'newCustomValue';
console.log(myDiv.dataset.customAttribute); // 输出 "newCustomValue"

需要注意的是，data-*属性的名称必须以data-为前缀，并且只能包含字母、数字、连字符和下划线。例如，data-custom-attribute是一个有效的data-*属性名称，而data-custom.attribute和data-customAttribute都是无效的。

总之，使用data-*属性和HTMLElement.dataset属性，可以方便地在JavaScript中为HTML元素添加和访问自定义属性。