change : function(){
var color_param = ${lightColor}
document.getElementById("需要变颜色的字体所在的容器ID").style.color = color_param
}
}
页面加载时调用 <body onload="ChangeColor.change()">
修改 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 = 0i <rows.lengthi++) {
var cells = rows[i].getElementsByTagName("td")
for(var c = 0c <cells.lengthc++) {
// 对应列
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")
}
})
})