javascript - jQuery/JavaScript 查找表列中的最高值

Question

这是我的 table

<table id="aktivita">
  <tr>
    <td>Jack</td>
    <td>450</td>
    <td>794</td>
    <td>784</td>
  </tr>
  <tr>
    <td>Steve</td>
    <td>145</td>
    <td>794</td>
    <td>789</td>
  </tr>
  <tr>
    <td>Mike</td>
    <td>2794</td>
    <td>2794</td>
    <td>79</td>
  </tr>
</table>

如何获取自第二列(名称之后)以来的每一列，并将最高值类别设置为高，最低值类别设置为低？ 如果更多 td 具有相同的值并且最高(或最低)，则所有 td 都必须具有正确的类别。

$('#aktivita tr').each(function(){
  var first = $(this).find("td:nth-of-type(2)").text();
  var second = $(this).find("td:nth-of-type(3)").text();
  var third = $(this).find("td:nth-of-type(4)").text();


  console.log(first);
  console.log(second);
  console.log(third);
});

这就是我所拥有的。我不太喜欢使用基本相同的代码来变量。有什么办法可以让它干燥吗？

Answer 1

您可以循环遍历td并找到最小值和最大值并进行相应处理

$(function(){
  var cols = []
  var trs = $('#aktivita tr')
  var data =$.each(trs , function(index, tr){
    $.each($(tr).find("td").not(":first"), function(index, td){
      cols[index] = cols[index] || [];
      cols[index].push($(td).text())
    })
  });
  cols.forEach(function(col, index){
    var max = Math.max.apply(null, col);
    var min = Math.min.apply(null, col)
    $('#aktivita tr').find('td:eq('+(index+1)+')').each(function(i, td){
      $(td).toggleClass('max', +$(td).text() === max)
      $(td).toggleClass('min', +$(td).text() === min)  
    })
  })
})

.max {
  color: blue
}

.min {
  color: red
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<table id="aktivita">
  <tr>
    <td>Jack</td>
    <td>450</td>
    <td>794</td>
    <td>784</td>
  </tr>
  <tr>
    <td>Steve</td>
    <td>145</td>
    <td>794</td>
    <td>789</td>
  </tr>
  <tr>
    <td>Mike</td>
    <td>2794</td>
    <td>2794</td>
    <td>79</td>
  </tr>
</table>