JS 获取数据属性 - Javascript

在 JavaScript 中，获取数据属性是很常见的操作。本文将介绍如何使用 JavaScript 获取数据属性。

获取 HTML 元素的数据属性

要获取 HTML 元素的数据属性，可以使用 dataset 属性。该属性可用于获取以 data- 开头的属性值。例如，要获取 data-id 属性的值，可以使用以下代码：

const element = document.querySelector('#myElement');
const id = element.dataset.id;
console.log(id);

这将输出 data-id 属性的值。如果要获取其他数据属性，只需将属性名称替换为相应的名称即可。

获取自定义属性的数据属性

如果要获取自定义属性的数据属性，则无法使用 dataset 属性。相反，您需要使用 getAttribute() 方法，如下所示：

const element = document.querySelector('#myElement');
const myAttribute = element.getAttribute('myAttribute');
console.log(myAttribute);

这将输出 myAttribute 自定义属性的值。

获取诸如 aria-* 的 ARIA 属性

如果要获取 ARIA 属性值，则可以使用 getAttribute() 方法。例如，要获取 aria-label 属性的值，请使用以下代码：

const element = document.querySelector('#myElement');
const ariaLabel = element.getAttribute('aria-label');
console.log(ariaLabel);

这将输出 aria-label 属性的值。要获取其他 ARIA 属性的值，只需将属性名称替换为相应的名称即可。

以上就是获取数据属性的基本方法，希望对您有所帮助！