如何根据<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>