如何根据公式提供的值突出显示HTML表格上的单元格？(不使用Jquery)
要根据公式提供的值突出显示HTML表格上的单元格，可以使用JavaScript来实现。以下是一个实现的示例代码：
<!DOCTYPE html>
<html>
<head>
<title>Highlight Table Cells</title>
<style>
.highlight {
background-color: yellow;
}
</style>
</head>
<body>
<table id="myTable">
<tr>
<th>姓名</th>
<th>年龄</th>
<th>成绩</th>
</tr>
<tr>
<td>张三</td>
<td>25</td>
<td>80</td>
</tr>
<tr>
<td>李四</td>
<td>30</td>
<td>90</td>
</tr>
<tr>
<td>王五</td>
<td>28</td>
<td>70</td>
</tr>
</table>
<script>
// 获取表格
var table = document.getElementById("myTable");
// 获取所有行
var rows = table.getElementsByTagName("tr");
// 遍历每一行（从第二行开始，跳过表头）
for (var i = 1; i < rows.length; i++) {
// 获取当前行的所有单元格
var cells = rows[i].getElementsByTagName("td");
// 获取成绩单元格的值
var score = parseInt(cells[2].innerHTML);
// 根据公式判断是否需要突出显示
if (score >= 80) {
// 添加highlight类名来突出显示单元格
cells[2].classList.add("highlight");
}
}
</script>
</body>
</html>在上述代码中，我们首先定义了一个CSS样式，用于突出显示单元格。然后使用JavaScript获取表格及其行和单元格。通过遍历每一行，并根据公式判断是否需要突出显示单元格。如果需要突出显示，则添加highlight类名来应用CSS样式。
这个示例中使用了纯JavaScript来实现，没有使用任何第三方库或框架。
相关·内容
JavaScript DOM操作表格及样式
| 姓名 | 性别 | 年龄 |
|---|---|---|
| 汤高 | 男 | 20 |
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储
