表格的高亮显示 Table's HighLight

 

表格的高亮显示 Table's HighLight
演示： http://www.gaofan.com/learn/highlight.html

 

< TITLE > ..::  Table's HighLight ::.. </ TITLE >   
</ HEAD >     
< script  language ="JavaScript"  type ="text/javascript" > ...
<!--
function hl(Type)...{
var highlightcolor = "",textdecoration = ""; 
if (Type) ...{ highlightcolor = "#FFCCFF"; textdecoration = "#CC99FF"; }
var e = window.event || arguments.callee.caller.arguments[0];
var td = e.srcElement || e.target;
var i=0; var ctd;
while(true)...{
if(td&&td.nodeName=="TD")...{ctd=td;} 
i++;
if((td&&td.nodeName =="TR")||i>10)...{break;}
if(td)...{td = td.parentElement||td.parentNode;}
}
if(td&&td.nodeName =="TR")...{
td.style.backgroundColor = highlightcolor;
tb = td.parentElement||td.parentNode;
if(tb&& tb.nodeName=="TBODY")...{
var tr = tb.childNodes[0]; var tds = tr.childNodes;
for(var j=0;j<tds.length;j++)...{
if(tds[j].rowSpan>1)...{tds[j].style.backgroundColor = highlightcolor;}
}
ctd.style.backgroundColor = textdecoration;
return true;
}
}
}
//-->
</ script >
< BODY >
< h2 > Table's HighLight </ h2 >
< h3 > ..::  &#36710;&#20180; [ 2007-08-31 ] ::.. </ h3 >
< table  width ='600px'  border ='0'  cellpadding ='2'  cellspacing ='1'  bgColor ='#009900'  onmouseover ='hl(true);'  onmouseout ='hl(false);' >  
< tbody  bgColor ='#FFFFCC' >< tr >< td  width ='100px'  bgColor ='#FFFF00' >< b > 1 Row </ b ></ td >< td > 00 </ td >< td > 01 </ td >< td > 02 </ td >< td > 03 </ td >< td > 04 </ td >< td > 05 </ td >< td > 06 </ td ></ tr ></ tbody >
< tbody  bgColor ='#99FF99' >< tr >< td  rowspan ='2'  bgColor ='#CCFF00' >< b > 2 Rows </ b ></ td >< td > 10 </ td >< td > 11 </ td >< td > 12 </ td >< td  rowspan ='2' > 13 </ td >< td > 14 </ td >< td > 15 </ td >< td  rowspan ='2' > 16 </ td ></ tr >< tr >< td > 20 </ td >   < td > 21 </ td >< td > 22 </ td >< td > 24 </ td >< td > 25 </ td ></ tr ></ tbody >
< tbody  bgColor ='#CCFFFF' >< tr >< td  rowspan ='3'  bgColor ='#3366FF' >< b > 3 Rows </ b ></ td >< td > 30 </ td >< td > 31 </ td >< td  rowspan ='3' > 32 </ td >< td > 33 </ td >< td > 34 </ td >< td > 35 </ td >< td  rowspan ='3' > 36 </ td ></ tr >< tr >< td > 40 </ td >   < td > 41 </ td >< td > 43 </ td >< td > 44 </ td >< td > 45 </ td ></ tr >< tr >< td > 50 </ td >   < td > 51 </ td >< td > 53 </ td >< td > 54 </ td >< td > 55 </ td ></ tr ></ tbody >
</ table >
</ BODY >