使用 jQuery 给表格的每一行添加类名

当在网页中需要处理表格的时候，我们通常需要对表格的某些行，或者某些列进行处理。常见的需求包括：

• 根据某些特定的条件，对某些行进行高亮显示
• 鼠标悬浮在某些行的时候，让它们的背景发生变化
• …

这些需求都可以通过给表格的每行添加类名称来实现。下面我们来看看具体的实现方法：

方案一：使用 jQuery 的 each 方法

// 给表格的每一行添加类名
$('table tr').each(function() {
  $(this).addClass('table-row');
});

上面的代码中，我们使用了 jQuery 的 each 方法，它可以对 jQuery 对象中的每一个元素都执行一次指定的函数。在这个函数中，我们对当前行添加了类名 table-row。需要注意的是，我们使用了 $(this) 表示当前行的 jQuery 对象。

方案二：使用 jQuery 的 addClass 方法

jQuery 的 addClass 方法可以为每一个匹配元素添加指定的类名。使用它也可以很方便地为表格的每一行添加类名，如下所示：

// 给表格的每一行添加类名
$('table tr').addClass('table-row');

方案三：根据条件添加类名

当需要根据某些条件，选择性地给表格的某些行添加类名时，我们可以使用 jQuery 的 filter 方法。例如，我们要给表格中所有性别为女性的行添加类名，可以这样做：

// 给性别为女性的行添加类名
$('table tr').filter(':contains("女")').addClass('female-row');

上面的代码中，我们使用了 :contains 选择器，它可以选择包含指定文本的元素。需要注意的是，由于可能存在其他包含文本“女”的元素，我们需要筛选出包含正确文本的行，才能将类名添加上去。

总结

给表格的每行添加类名可以方便我们做很多事情，例如高亮显示特定的行，让鼠标悬浮在某些行上时出现提示信息等等。我们可以选择使用 each 方法，也可以使用 addClass 方法来实现。如果需要根据条件选择性地添加类名，可以使用 filter 方法对表格中的行进行筛选。