Vanilla Javascript：查找与给定 id 的元素同名的数据属性

Question

是否可以在 DOM 中找到具有与元素 id 相同名称的 data 属性的元素？（给数据属性赋予与 id 相同的值是一种不好的做法吗？）

示例语法：

HTML：

<li id="tab-1"></li>
<p data-tab="tab-1">Content 1</p>

很好奇如何在 Vanilla Javascript 中实现这一点。谢谢 ？

编辑：我希望制作我的代码，以便如果我有元素的 ID，如果我没有想到它，我可以只查找具有相同值的数据属性。

Answer 1

是的，你可以这样做。这是你如何做到的：

var usingId = document.querySelector('#tab-1');
var usingDt = document.querySelector('[data-tab="tab-1"]');
console.log(usingId);
console.log(usingDt);

<li id="tab-1">Tab</li>
<p data-tab="tab-1">P Tab</p>

这是一种不好的做法吗？. 不