Jquery 如何更改表格行的背景？

我的HTML代码：

<table class="tableclass">
<th>id</th><th>Name</th><th>Value</th>
<tr>
    <td>001</td>
    <td>Name 001</td>
    <td>This is some value for Key 001</td>
</tr>

<tr>
    <td>002</td>
    <td>Name 002</td>
    <td>This is some value for Key 002</td>
</tr>

<tr>
    <td>003</td>
    <td>Name 003</td>
    <td>This is some value for Key 003</td>
</tr>

<tr>
    <td>004</td>
    <td>Name 004</td>
    <td>This is some value for Key 004</td>
</tr>

</table>

和My jQuery以突出显示单击的表行：

$(".tableclass tr").click(function(){
    $(this).addClass("rowHighlight");
});

类

.rowHighlight{背景色：#AEB6BF；}

有了这段代码，我无法更改奇数行的背景颜色，该行的背景来自css。我也希望能够更改该行的背景

我该怎么做

---

谢谢。

只需使用.row高亮显示td{背景色：您的颜色

$（“.tableclass tr”）。单击（函数（）{
$（this.addClass（“rowHighlight”）；
})；

表格{
边框：0px实心#CCC；
边界塌陷：塌陷；
}
运输署{
边界：无；
}
tr:n个孩子（偶数）{
背景色：#CCD1D1；
}
.row高亮显示td{背景色：红色；填充：0px；}

idNameValue
001
姓名001
这是键001的一些值
002
姓名002
这是键002的一些值
003
姓名003
这是003键的一些值
004
姓名004
这是键004的一些值

在jQuery中，改为执行此操作

$(".tableclass tr").click(function(){
    $(this).css("background-color","#AEB6BF")
});

idNameValue
001
姓名001
这是键001的一些值
002
姓名002
这是键002的一些值
003
姓名003
这是003键的一些值
004
姓名004
这是键004的一些值
**如果要在鼠标悬停或单击时更改行颜色，可以使用css。**
.tableclass tr:悬停，.tableclass tr:活动，.tableclass tr:已访问{
背景色：#CCD1D1；
光标：指针；
}

将背景色添加到td而不是tr so，.rowHighlight td{background color:#AEB6BF；}感谢堆..它成功了！！！！更新了边框问题，您可以根据需要调整它

tr.rowHighlight{}

稍好一点如何删除默认显示的边框/空白？我尝试了

，但它不起作用。我希望整行显示在水平行中，

之间没有任何空白。如何删除默认显示的边框/空白？我尝试了

但它不起作用。I希望整行显示在水平行中，

@Somename更新了它。您可以根据需要调整外边框。另请参见我在上一节课中添加的填充。如果不想添加“为什么需要td”，可以删除它为什么不选择更高选择性的选择器？@vp_arth但如果是奇数行，则单击此选择器时不会更改颜色。它保留其背景色。

$(".tableclass tr").click(function(){
    $(this).css("background-color","#AEB6BF")
});

<table class="tableclass">
<th>id</th><th>Name</th><th>Value</th>
<tr>
    <td>001</td>
    <td>Name 001</td>
    <td>This is some value for Key 001</td>
</tr>

<tr>
    <td>002</td>
    <td>Name 002</td>
    <td>This is some value for Key 002</td>
</tr>

<tr>
    <td>003</td>
    <td>Name 003</td>
    <td>This is some value for Key 003</td>
</tr>

<tr>
    <td>004</td>
    <td>Name 004</td>
    <td>This is some value for Key 004</td>
</tr>

</table>

**If you want to change the row color on hover or on click, you can do this using css.** 

.tableclass tr:hover, .tableclass tr:active, .tableclass tr:visited{
background-color: #CCD1D1;
cursor:pointer;

}