如何选择子节点但第一个元素

时间:2011-09-16 17:05:57

标签: html css css-selectors

所以我得到了一张桌子,我希望在所有<tr>元素中设置样式,但第一个。例如:

<table>
    <tr><th>This receives header styles</th></tr>
    <tr><td>This receives item styles</td></tr>
    <tr><td>This receives item styles</td></tr>
    <tr><td>This receives item styles</td></tr>
</table>

我知道我必须使用选择器,但我不知道怎样也无法在网上找到它= S

2 个答案:

答案 0 :(得分:6)

一般的兄弟选择器~允许您选择接下来的每个元素。您可以使用此选择器:

table tr:first-child ~ tr

适用于IE7 +。

如果您可以修改HTML以使其更具语义,则可以将第一行的th单元格放在thead中,其余的放在tbody中:

<table>
  <thead>
    <tr><th>This receives header styles</th></tr>
  </thead>
  <tbody>
    <tr><td>This receives item styles</td></tr>
    <tr><td>This receives item styles</td></tr>
    <tr><td>This receives item styles</td></tr>
  </tbody>
</table>

然后使用此选择器:

table tbody tr

适用于较旧的浏览器,以备不时之需。

答案 1 :(得分:0)

$('#table-id tr').not(':first-child').addClass('class');

应该这样做