Jquery将css类添加到表的第一行

Question

大家好我想尝试使用jquery将css类添加到表的第一个tr中.我知道这应该是非常容易的,我找到了许多提供正确解决方案的链接和问题.像这三个和其他:

如何使用jQuery在HTML表中获取<tbody>的第一个<tr>的id？

JQuery,选择第一行表

如何使用jQuery为页面上的每个表的第一行设置样式

但对我来说,这些都不起作用.

我有一个ID为DataTableMovimenti的表,我想应用css类"ct-active"

我尝试了以下说明:

$("#DataTableMovimenti tr:first").addClass('ct-active');
$("#DataTableMovimenti").find("tr:first-children").addClass("ct-active");
$("#DataTableMovimenti").find("tr:first").addClass("ct-active");
$("#DataTableMovimenti").find("tr:eq(0)").addClass("ct-active");
$("#DataTableMovimenti").find("tbody tr:eq(0)").addClass("ct-active");
$("#DataTableMovimenti").children("tr:first").addClass("ct-active");
$("#DataTableMovimenti").closest('tr').addClass('ct-active');

我$document.ready()在jsp 中的函数中插入了代码,因为我想在进入页面时突出显示表格的第一行.

该表具有以下结构:

<table id="DataTableMovimenti" class="table ct-datatables">
<thead>
   <tr></tr>
      ............
</thead>
<tbody>
    <tr id="tableRowId" class="table-row-tr"></tr>
      ...........
</tbody>
</table>

我想更改tbody部分中第一个tr的css类.提前致谢

Answer 1

添加tbody您的选择器.

$("#DataTableMovimenti tbody tr:first").addClass('ct-active');

.ct-active{
  color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="DataTableMovimenti">
  <thead>
    <tr>
      <td>First thead</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>First tbody</td>
    </tr>
     <tr>
       <td>Second tbody</td>
     </tr>
  </tbody>
</table>

用css做这个更好.

#DataTableMovimenti tbody > tr:first-child {
  color:red;
 }

    <table id="DataTableMovimenti">
      <thead>
        <tr>
          <td>First thead</td>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>First tbody</td>
        </tr>
        <tr>
          <td>Second tbody</td>
        </tr>
      </tbody>
    </table>