怎么根据<td>的内容,改变td内容的颜色
日期：2014-05-16 浏览次数：20580 次
如何根据<td>的内容,改变td内容的颜色
一个页面里面,有好几个表格,现在想通过<td>的内容,自动改变td内容的颜色
如果<td>内有 "-",则变绿色,如果没有则变红色.
------解决方案--------------------
综合了一下
一个页面里面,有好几个表格,现在想通过<td>的内容,自动改变td内容的颜色
如果<td>内有 "-",则变绿色,如果没有则变红色.
------解决方案--------------------
综合了一下
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>dhtml.table.changeCellColor.html</title>
<meta name="generator" content="editplus" />
<meta name="author" content="Gao YiXiang" />
<meta name="email" content="yixianggao@126.com" />
<meta name="keywords" content="javascript dhtml dom" />
<meta name="description" content="I love web development." />
</head>
<body>
<h3>根据 Cell 内容改变字体颜色！注：IE6sp1, FF2 测试可用。</h3>
<table id="tbe01" border="1">
<tr>
<td>01-01</td>
<td>0102</td>
</tr>
<tr>
<td>0201</td>
<td>02-02</td>
</tr>
</table>
<table id="tbe02" border="1">
<tr>
<td>01-01</td>
<td>0102</td>
</tr>
<tr>
<td>0201</td>
<td>02-02</td>
</tr>
</table>
<table id="tbe03" border="1">
<tr>
<td>01-01</td>
<td>0102</td>
</tr>
<tr>
<td>0201</td>
<td>02-02</td>
</tr>
</table>
</body>
<script type="text/javascript">
<!--
function changeCellColor(sTableId)
{
var oTbe = document.getElementById(sTableId);
var td;
for (var i=0; i<oTbe.rows.length; i++)
{
for (var j=0; j<oTbe.rows[i].cells.length; j++)
{
with (oTbe.rows[i].cells[j])
{
style.color = (innerHTML.indexOf("-") > -1)?"blue":"red";
}
}
}
}
changeCellColor("tbe01");
changeCellColor("tbe03");
//-->
</script>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
