<分区>
标签 javascript html css
<分区>
我有一个 javascript，它使 HTML 中的表格可排序。但是我想设置使用 javascript 单击的列标题的样式。
如何获取表格的标题？我知道我需要更改的标题栏。
这是我的 javascript 现在返回给我的内容。
javascript
console.log(table.tHead);
输出到控制台:
<thead>
<tr>
<th>Name</th>
<th>Times Placed</th>
<th>UMF (KB)</th>
<th>UAC</th>
<th>Texture Memory (MB)</th>
<th>Texture Count</th>
<th>Mesh Memory (KB)</th>
<th>Mesh Count</th>
<th>Path</th>
</tr>
</thead>
最佳答案
这会将 selected 类添加到点击的第 元素，并且会从之前点击的 元素中删除 :selected 类>第
document.querySelector('thead').addEventListener('click', function(e) {
var current;
if (e.target.tagName === 'TH') {
current = document.querySelector('th.selected');
if (current) {
current.classList.remove('selected');
}
e.target.classList.add('selected');
}
});th {
border: 1px solid #bbb;
padding: 0.5em;
}
.selected {
background: #def;
}<table>
<thead>
<tr>
<th>Name</th>
<th>Times Placed</th>
<th>UMF (KB)</th>
<th>UAC</th>
<th>Texture Memory (MB)</th>
<th>Texture Count</th>
<th>Mesh Memory (KB)</th>
<th>Mesh Count</th>
<th>Path</th>
</tr>
</thead>
</table>假设页面上只有一个表格，它应该可以与您现有的代码一起使用。
关于javascript - 如何更改表格中点击的样式，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32702960/