如何从选定的表行中获取最小和最大数量？

Posted 2021-05-04

这是指我之前的问题。

How to highlight/color multiple rows on selection?

<table id="toppings"  border="1" cellpadding="2">
   <tr id="id1">
      <td>3</td>
      <td>row12</td>
      <td>row13</td>
  </tr>
  <tr id="id2">
      <td>12</td>
      <td>row22</td>
      <td>row23</td>
  </tr>
  <tr id="id3">
      <td>15</td>
      <td>row32</td>
      <td>row33</td>
  </tr>
  <tr id="id4">
      <td>22</td>
      <td>row42</td>
      <td>row43</td>
 </tr>
 <tr id="id5">
      <td>23</td>
      <td>row52</td>
      <td>row53</td>
 </tr>
 <tr id="id6">
   <td>55</td>
   <td>row62</td>
   <td>row63</td>
 </tr>
</table>

javascript代码：

//Get list of rows in the table
var table = document.getElementById("toppings");
var rows = table.getElementsByTagName("tr");

var selectedRow;

//Row callback; reset the previously selected row and select the new one
function SelectRow(row) {
    if (selectedRow !== undefined) {
        selectedRow.style.background = "#d8da3d";
    }
    selectedRow = row;
    selectedRow.style.background = "white";
}

//Attach this callback to all rows
for (var i = 0; i < rows.length; i++) {
    var idx = i;
    rows[idx].addEventListener("click", function(){SelectRow(rows[idx])});
}

但这次我在表中添加了一个事件选择行，并尝试从所选行（第一列）中获取最小值和最大值。如上表所示，如果我选择中间四行，我应该得到min = 12和max = 23.如何实现？

答案

你可以有两个功能。我展示了getMinValueExample（）。

function getMinValueExample(rows){
var minValue = null;
for (var i = 0; i < rows.length; i++){
    var firstTd = rows[i].getElementsByTagName('td')[0];
    var currentValue = parseInt(firstTd.innerhtml);
    if(minValue == null || minValue > currentValue)
        minValue = currentValue;
}
return minValue;
}

（不测试所以可以包含一些类型错误，但你应该得到这个想法）所以如果你在声明行之后调用它，它会返回最小值。如果你打电话给这个你获得最大值

function getMaxValueExample(rows){
var maxValue = null;
for (var i = 0; i < rows.length; i++){
    var firstTd = rows[i].getElementsByTagName('td')[0];
    var currentValue = parseInt(firstTd.innerHTML);
    if(maxValue == null || maxValue < currentValue)
        maxValue = currentValue;
}
return maxValue;
}