我有很多表,想要在表的第一行设置 css 样式,前提是第一行有行跨度。
<table>
<tbody>
<tr>
<td rowspan="2" width="110">Name</td>
<td width="110">Size</td>
<td width="110">Status</td>
</tr>
<tr>
<td>Meter</td>
<td>true/false</td>
</tr>
<tr>
<td>Code A</td>
<td>1</td>
<td>false</td>
</tr>
</tbody>
</table>
通过这种风格,我尝试更改第一行:
thead tr:first-child,
tbody tr:first-child {
background-color: #1DA6C0;color: #fff;
}
So I looking for a css style to change table just like Image:
您可以使用以下方法在 Javascript 后台设置它:
第 n 个子级(-n+${rowspan})
Eg.
let tr = document.getElementsByTagName("tr")[0];
let td = tr.getElementsByTagName("td")[0];
let rowspan = td.rowSpan? td.rowSpan:1;
var nodes = document.querySelectorAll(`tbody tr:nth-child(-n+${rowspan})`);
for (let i = 0; i < nodes.length; i++) {
nodes[i].style.background = '#1DA6C0';
}
https://jsfiddle.net/xugL8s9b/10/ https://jsfiddle.net/xugL8s9b/10/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)