javascript - 在 JQuery 中使用自定义数据属性将 css 应用于 tr

Question

我有一个表，每个 tr 元素都有一个自定义数据属性，我想对某些值应用样式。

在 HTML 中:

<table id="notify" class="t_notify">
<tr data-notify="101">
 <td>data</td>
 <td>data</td>
</tr>
<tr data-notify="102">
 <td>data</td>
 <td>data</td>
</tr>
<!-- and goes -->
</table>

使用 CSS:

.t_notify>tbody>tr{background:#BBB;}
.t_notify>tbody>tr:hover{background:transparent;}

我在 Jquery 中尝试在单击某个 tr 元素时执行此操作，例如:

$("#notify > tbody > tr").attr("[data-notify='101']").css({"background":"#CCC"});

但这行不通。我需要一些帮助。

Answer 1

好的方法

您的查询必须在选择器中，如下所示:

$("#notify > tbody > tr[data-notify='101']").css({"background":"#CCC"});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="notify" class="t_notify">
<tr data-notify="101">
 <td>data</td>
 <td>data</td>
</tr>
<tr data-notify="102">
 <td>data</td>
 <td>data</td>
</tr>
<!-- and goes -->
</table>

属性()

attr() 函数返回属性的值或设置它。就您而言，您两者都不想要。希望对您有所帮助。