如何用js根据表格内的值改变表格背景色？ 且数据是django传入的
我现在是有个表格里面的数据是用django传入的，现有4行4列表格（整个html只有这一个表格）比如说是2424342152315423不同数字颜色不同，比如说1和2黄色...
我现在是有个表格 里面的数据是用django传入的，
现有4行4列表格（整个html只有这一个表格）
比如说是 2 4 2 4
3 4 2 1
5 2 3 1
5 4 2 3
不同数字 颜色不同，比如说1和2 黄色 3和4 绿色，5 红色 该怎么用js写
另外我已有js代码，是根据键盘输入来响应的 上述的代码应该在它之前还是之后还是都可以 展开
现有4行4列表格（整个html只有这一个表格）
比如说是 2 4 2 4
3 4 2 1
5 2 3 1
5 4 2 3
不同数字 颜色不同，比如说1和2 黄色 3和4 绿色，5 红色 该怎么用js写
另外我已有js代码，是根据键盘输入来响应的 上述的代码应该在它之前还是之后还是都可以 展开
1个回答
展开全部
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>main.html</title>
<style type="text/css">
table {
margin: auto;
width: 300px;
border-collapse: collapse;
border: 1px solid black;
}
td {
border: 1px solid black;
text-align: center;
font: 20px/1.5 Consolas, 微软雅黑;
}
</style>
<script type="text/javascript">
var json = [
2, 4, 2, 4, 3, 4, 2, 1, 5, 2, 3, 1, 5, 4, 2, 3
];
var row = 4, col = 4;
var COLORS =
{
"1" : "yellow",
"2" : "yellow",
"3" : "green",
"4" : "green",
"5" : "red"
};
onload = function ()
{
var table = document.createElement ('table');
var tbody = document.createElement ('tbody');
table.appendChild (tbody);
for ( var i = 0; i < row; i++)
{
var tr = tbody.insertRow (tbody.rows.length);
for ( var j = 0; j < col; j++)
{
var td = tr.insertCell (tr.cells.length);
var val = json[i * col + j];
var txt = document.createTextNode (val);
!!COLORS[val] ? td.style.color = COLORS[val] : 0;
td.appendChild (txt);
}
}
document.body.appendChild (table);
}
</script>
</head>
<body>
</body>
</html>
追问
效果很好，但如果表格不是用js创建的，而是本来就有的，用js捕捉表格数据再判断再选相应颜色输出该怎么写，我会再加分
追答
你就循环table里面的td里面的文本，判断修改就可以了，道理都是类似的，举一反三吧
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
