利用JavaScript和jQuery高效突出显示表格最大值
在网页表格数据处理中，快速识别最大值至关重要。本文演示如何使用JavaScript和jQuery，无需Bootstrap框架，即可轻松实现表格最大值高亮显示。
目标：在一个ID为“xx”的表格中，将最大数值单元格标注为红色。
核心思路：获取所有表格单元格数值，遍历查找最大值，并为最大值单元格应用红色样式。
以下代码片段利用JavaScript的querySelectorAll、Array.from和reduce方法实现此功能：
Array.from(document.querySelectorAll('#xx td')).reduce((result, el) => {
let current = parseFloat(el.textContent.trim()); // 获取单元格文本内容并转换为数字，去除空格
current = isNaN(current) ? 0 : current; // 处理非数值单元格
if (current > result.max) {
result.max = current;
result.elements = [el];
} else if (current === result.max) {
result.elements.push(el);
}
return result;
}, { max: 0, elements: [] }).elements.forEach(el => el.style.color = 'red');
代码首先使用querySelectorAll选择ID为"xx"表格的所有td元素，Array.from将其转换为数组。reduce方法迭代数组，比较每个单元格的数值，找到最大值并存储对应的元素。最后，forEach方法将所有包含最大值的单元格文字颜色设置为红色。 代码已改进，处理了非数值单元格和空格问题，确保代码更健壮。
此方法简洁高效，无需额外依赖，充分利用JavaScript原生能力完成任务。 记住将#xx替换为您的表格ID。
