javascript - JS hasAttribute 带有数据属性值

Question

有没有一种原生方法(没有 jQuery)来检查 dom 元素是否具有具有所选值的属性。例如:

//assume doc has
data-mod="do" defined

这将是真的:

document.hasAttribute('data-mod');

但这将是错误的:

document.hasAttribute('data-mod="do"')

有什么方法可以本地检查 DOM 元素上的数据属性及其值吗？

Answer 1

您必须通过 getAttribute 访问该属性的值并将其与您期望的字符串进行比较:

if (node.getAttribute('data-mod') === 'do') {
    ...
}

对于现代浏览器，您可以使用 matches :

if (node.matches('[data-mod="do"]')) {
    ...
}

…或者对于[data-*]属性，您可以使用dataset :

if (node.dataset.mod === 'do') {
    ...
}