javascript - 查找具有特定值的单元格并将类应用于同一行中的单元格

我有一个排名表，其中列出了每个玩家的特定Elo评分。根据他们的Elo等级，我希望玩家的名字根据他们的排名成为特定的颜色。我一直在使用下面的代码：

if (parseInt($("td.data-rating").val()) > 100) {
  $(this).closest("tr").find("td.data-name").addClass("important");
}

JSFiddle
为什么此代码不起作用？我是否错误地使用了“ this”？

最佳答案

您有几个问题：

this关键字引用Window对象
仅HTMLInputElement具有值，.val()的使用不正确
您必须迭代每个<td>元素才能设置classList

这应该为您工作：

$(function() {
  $("td.data-rating").each((i, el) => {
    if (parseInt(el.textContent) > 1000) {
      $(el).closest("tr").find("td.data-name").addClass("important");
    }
  })
})

.important {
  color: red;
}

<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

</head>

<table>
  <tr>
    <td class="data-name">Player 1</td>
    <td>1</td>
    <td class="data-rating">1200</td>
  </tr>
  <tr>
    <td class="data-name">Player 2</td>
    <td>1</td>
    <td class="data-rating">1150</td>
  </tr>
  <tr>
    <td class="data-name">Player 3</td>
    <td>1</td>
    <td class="data-rating">1000</td>
  </tr>
</table>

</html>

关于javascript - 查找具有特定值的单元格并将类应用于同一行中的单元格，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50322402/