1。<td>必须有id号 即<td id="td1">。( 方便javaScript调用 document.getElementById("td1"))
2。CSS样式中背景颜色background-color,颜色格式#rrggbb,rgb(rr,gg,bb)(javaScript背景颜色backgroundColor)
范例html文件代码:
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312">
<title>改变表格颜色</title>
</head>
<body>
<table width="400" border="1" cellspacing="0" cellpadding="0">
<tr>
<td id="td1" bgcolor="#000000"> </td><!--设置黑色的(实际为红色)-->
<td bgcolor="#000000"> </td>
</tr>
</table>
</body>
<script language="javascript" type="text/javascript">
<!--
document.getElementById("td1").style.backgroundColor="#FF0000"
//引用了td1单元格,改变backgroundColor值
-->
</script>
</html>
献上微薄之力<html>
<head>
<title>changeTdColor</title>
<style>
table,td{
border:1px solid black
border-collapse:collapse
}
td{
border:1px solid black
border-collapse:collapse
width="30px"
height="15px"
}
</style>
<script>
function changeColor(obj){
var bgColor = Math.floor(Math.random()*255*255*255)
obj.style.backgroundColor = bgColor
}
</script>
</head>
<body>
<table>
<tr>
<td onClick="changeColor(this)">1</td>
<td onClick="changeColor(this)">2</td>
<td onClick="changeColor(this)">3</td>
</tr>
<tr>
<td onClick="changeColor(this)">4</td>
<td onClick="changeColor(this)">5</td>
<td onClick="changeColor(this)">6</td>
</tr>
<tr>
<td onClick="changeColor(this)">7</td>
<td onClick="changeColor(this)">8</td>
<td onClick="changeColor(this)">9</td>
</tr>
</table>
</body>
</html>
<script language="javascript" type="text/javascript">function chgbg(id){
var obj=window.document.getElementById(id)
var bg=obj.style.backgroundColor
if(bg=='') obj.style.backgroundColor='#f00'
else obj.style.backgroundColor=''
}
</script>
<table width="100%" border="1" cellspacing="0" cellpadding="4">
<tr>
<td id="td1"></td>
<td id="td2"></td>
<td id="td3"></td>
</tr>
<tr>
<td id="td4"></td>
<td id="td5"></td>
<td id="td6"></td>
</tr>
</table>
<input type="button" value="点击改变指定单元格背景" onClick="chgbg('td1')" />
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)