按元素的数据属性获取表列

Question

我有一个表，其中有一个div元素，其数据属性包含ID。

<table>
<thead>
<tr>
....
<th class="selected">
<div data-id="161380">
Condiments
</div>
</th>
...
</tr>
</thead>
</table> 

如果给我的ID与数据属性中的ID匹配，我需要从列中删除类。如果它在jQuery id中，只需执行以下操作：

var id = "161380";
$("[data-id]="+id).closest("th").removeClass("selected");

然而，我需要在vanilaJS中完成它，我的技能相当粗糙。。。

Answer 1

最近classList

你有一些遗漏的引号和括号太

const id = "161380";
document.querySelector("[data-id='"+id+"']")
.closest("th")
.classList
.remove("selected");

.selected {
border: 1px solid black
}

<table>
<thead>
<tr>
<th class="selected">
<div data-id="161380">
Condiments 1
</div>
</th>
<th class="selected">
<div data-id="1234">
Condiments 2
</div>
</th>
</tr>
</thead>
</table>