的jQuery/JavaScript的查找表列最高值

Question

這裏是我的表

<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具有相同的值並且最高（或最低），則所有的都必須具有適當的等級。

$('#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 S和發現的最小和最大和工藝相應

$(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>

Answer 2

您可以使用map()找到分鐘和每個tr的最大值，並添加類。

var i = 1; 
 

 
while (i < $('tr:first-child td').length) { 
 
    var ar = $('table tr').map(function() { 
 
    return Number($(this).find('td:nth-child(' + (i + 1) + ')').text()); 
 
    }) 
 

 
    var max = Math.max.apply(null, ar); 
 
    var min = Math.min.apply(null, ar); 
 

 
    var ar = $('table tr').find('td').each(function() { 
 
    if (Number($(this).text()) == max) { 
 
     $(this).addClass('max'); 
 
    } else if (Number($(this).text()) == min) { 
 
     $(this).addClass('min'); 
 
    } 
 
    }) 
 

 
    i++; 
 
}

.max { 
 
    color: red; 
 
} 
 
.min { 
 
    color: green; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/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>

Answer 3

這一次似乎爲我工作：

var offset = 1; 

$('#aktivita tr').each(function() { 
    var values = []; 

    $(this).children('td').each(function (i,v) { 
     if (i < offset) return; 
     var value = parseInt($(this).text()); 
     if(!isNaN(value)) 
      values.push(value); 
    }); 

    var maxValue = Math.max.apply(null, values); 
    var minValue = Math.min.apply(null, values); 

    $(this).children('td').each(function() { 
     if ($(this).text() == maxValue.toString()) { 
      $(this).addClass('max'); 
     } 

     if ($(this).text() == minValue.toString()) { 
      $(this).addClass('min'); 
     } 
    }); 

}); 

哪裏偏移列數的實際值開始之前（以防萬一，你只提供簡單的數據） 。