如果& lt; td>有最大的整型数,在它的<添加CSS类到<td>——jquery

If <td> has the largest int, in its <tr> add css class to <td> - jquery

本文关键字:td jquery 添加 CSS 类到 整型 lt 如果      更新时间:2023-09-26

我有一个数据表,我试着看一眼它,并找到每一行的最高数字。

为了做到这一点,我添加了一个css类,名为最高的<td>,像这样
  <tr>
      <td>4.2</td>
      <td class="highest">5.0</td>
      <td>2.9</td>
  </tr>

与这个css

td.highest {font-weight:bold;}

但这都是硬编码,我试图找出如何写这个使用jquery,但我很新的js和不确定是否开始,我正在寻找使用Math.max,但我可以告诉那是用于数组,而不是阅读html,有什么想法吗?

我在这里做了一个jsfiddle - http://jsfiddle.net/pudle/vEUUQ/

第一个bash -可能有更短(可能更有效)的答案…

$('tr').each(function() {
    var $td = $(this).children();
    // find all the values
    var vals = $td.map(function() {
        return +$(this).text();
    }).get();
    // then find their maximum
    var max = Math.max.apply(Math, vals);
    // tag any cell matching the max value
    $td.filter(function() {
        return +$(this).text() === max;
    }).addClass('highest');
});

demo at http://jsfiddle.net/alnitak/DggUN/

基于这个结构:

<table>
    <tr>
      <td>4.2</td>
      <td>5.0</td>
      <td>2.9</td>
  </tr>
</table>

你可以使用JS/jQuery做:

var highest = 0;
$("table tr td").each(function() {
     var current = $(this).text();
    if (current > highest) {
       highest = current;
       $(".highest").removeClass();
       $(this).addClass('highest');   
    }
});
http://jsfiddle.net/syU82/

我能想到的最简单的方法是使用http://underscorejs.org/#max或http://lodash.com/docs#max,并传入一个函数来进行过滤。

var result = _.max($("td"),function(td){ return parseFloat($(td).text()); });
result.addClass("highest");

否则你可以长时间地做:

var result,max 0;
$("td").filter(function(){
   var myval = parseFloat($(this).text());
   if(myval > max){
      result = this;
      max = myval;
   }
});
result.addClass("highest");

这是另一个解决方案,虽然不如其他一些解决方案好。

$('tr').each(function() {
    var $highest_el;
    var highest_num;
    $('td', this).each(function() {
        if ( $highest_el === undefined || parseFloat($(this).text()) > highest_num ) {
            $highest_el = $(this);
            highest_num = $(this).text();
        }
    });
    $highest_el.addClass('highest');
});

jsFiddle: http://jsfiddle.net/hRJLQ/2/