网站制作学习网JS脚本→正文:表格整列换颜色
字体:

表格整列换颜色

JS脚本 2009/6/24 9:12:40  点击:不统计

关键词:表格整列换颜色,js实现整列变颜色





查看效果:js实现整列变颜色



<!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>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>js整列换颜色</title>

</head><SCRIPT LANGUAGE="JavaScript">

<!--

var tbl = document.getElementById("orderTab"),row=tbl.rows,cel=tbl.getElementsByTagName("td"),W=0;

var H = function(i,cor){for(var n=0,c;c=row[n++];){c.cells[i].style.background=cor;}}

for(var i=0,r;r=cel[i++];){

r.onmouseover = function(){H(W,"#FFF"); W=this.cellIndex; H(W,"red")}

}

//-->

</SCRIPT>

<body>

<table width="549" height="30" align="center" border="1" cellpadding="0" cellspacing="0" id="orderTab">

<tr>

<td>表格整列换颜色</td>

<td>表格整列换颜色</td>

<td class="col">表格整列换颜色</td>

</tr>

<tr>

<td>表格整列换颜色</td>

<td>表格整列换颜色</td>

<td class="col">表格整列换颜色</td>

</tr>

<tr>

<td>表格整列换颜色</td>

<td>表格整列换颜色</td>

<td class="col">表格整列换颜色</td>

</tr>

<tr>

<td>表格整列换颜色</td>

<td>表格整列换颜色</td>

<td class="col">表格整列换颜色</td>

</tr>

<tr>

<td>表格整列换颜色</td>

<td>表格整列换颜色</td>

<td class="col">表格整列换颜色</td>

</tr>

<tr>

<td>表格整列换颜色</td>

<td>表格整列换颜色</td>

<td class="col">表格整列换颜色</td>

</tr>

</table>



</body>

</html>

·上一篇:多层层显示js >>    ·下一篇:js图片翻滚效果 >>
推荐文章
最新文章