怎么用js根据单元格中的内容来改变table中的整行字体颜色
table绑定的数据中有一列入库量,如果这个入库量是负数,就设置整行的字体变成红色。用js如何实现...
table绑定的数据中有一列入库量,如果这个入库量是负数,就设置整行的字体变成红色。用js如何实现
展开
展开全部
修改 column_num 的值对应你 table 中的列数,下例检查的是第二列
<script type="text/javascript">
window.onload = function() {
// 第二列
var column_num = 2;
// 获取元素
var table = document.getElementById("table"),
rows = table.getElementsByTagName("tr");
// 循环表格
for(var i = 0; i < rows.length; i++) {
var cells = rows[i].getElementsByTagName("td");
for(var c = 0; c < cells.length; c++) {
// 对应列
if(c + 1 === column_num
// 判断是否小于 0
&& parseFloat(cells[c].innerHTML) < 0) {
// 两者均成立,改变颜色
rows[i].style.color = "#f00";
// 检查下一行
break;
}
}
}
};
</script>
BBB 和 CCC 这两行会变成红色
<table border="1" id="table">
<tr><td>AAA</td><td>124</td><td>XXX</td></tr>
<tr><td>BBB</td><td>-66</td><td>YYY</td></tr>
<tr><td>CCC</td><td>-95</td><td>ZZZ</td></tr>
</table>
如果你使用 jQuery,那可以更简单一些。没有的话就用上面的原生 JavaScript 代码。
$(function() {
$("#table tr td:nth-child(2)").each(function() {
if(parseFloat($(this).text()) < 0) {
$(this).parent().css("color", "#f00");
}
});
});
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询