How To Get HTML Table Column Max Value In Javascript
In This Javascript Tutorial we will See How To Find The Maximum Value In An HTML Table Column using JS And Netbeans Editor .
Project Source Code:
<!DOCTYPE html>
<html>
<head>
<title>Javascript Max Val From Table Column</title>
<meta charset="windows-1252">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<table id="table" border="1">
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Age</th>
</tr>
<tr>
<td>A1</td>
<td>B1</td>
<td>43</td>
</tr>
<tr>
<td>A2</td>
<td>B2</td>
<td>28</td>
</tr>
<tr>
<td>A3</td>
<td>B3</td>
<td>15</td>
</tr>
<tr>
<td>A4</td>
<td>B4</td>
<td>50</td>
</tr>
<tr>
<td>A5</td>
<td>B5</td>
<td>31</td>
</tr>
<tr>
<td>A6</td>
<td>B6</td>
<td>85</td>
</tr>
<tr>
<td>A7</td>
<td>B7</td>
<td>18</td>
</tr>
</table>
<span id="val"></span>
<script>
var table = document.getElementById("table"), maxVal;
for(var i = 1; i < table.rows.length; i++)
{
// if its the first row get th value
if(i === 1){
maxVal = table.rows[i].cells[2].innerHTML;
}
// test the values
else if(maxVal < table.rows[i].cells[2].innerHTML)
{
maxVal = table.rows[i].cells[2].innerHTML;
}
}
// display the max val
document.getElementById("val").innerHTML = "Max Value = "+maxVal;
console.log(maxVal);
</script>
</body>
</html>
OUTPUT: