一个表格问题,可能有点难度

目前已经有了一个网站,其中许多页面有动态表格,现在需要实现的是把页面中的动态表格在按单双行显示不同的颜色(不是页面中所有的表格,只是其中的一个表格)。有没有什么简单的方法来实现。
因为这些页面中都调用了css,我想通过css来实现,不知道可不可行。
谢谢帮助
---------------------------------------------------------------

滿足條件可以這樣加樣式:
document.all.**.className="myCSS";
---------------------------------------------------------------

应该可以实现,采用样式中定义HTC,
.table1 {behavior:url(table.htc);
}
在table.htc中定javascript脚本实现按单双行显示不同的颜色
---------------------------------------------------------------

定义两个底色不同的class
在你动态产生表格时
for ....
if trCls = class1 then
trCls=class2
else
trCls=class1
end if
%>

  1<tr ...="" <html="" =trcls="" \---------------------------------------------------------------="" ```="" class="```" html文件:="" next="" 因为无任你有几百个页面你只需要在这一个htc里面编程就可以了="" 如果所有网页使用了公用的css,无疑在这个css引入htc是最简单的方法。="" 实例="">
  2<head>
  3<style>   
  4<!--   
  5.table1 { behavior:url(table.htc); }   
  6\-->   
  7</style>
  8</head>
  9<body>
 10<table border="1" bordercolor="#111111" cellpadding="0" cellspacing="0" class="table1" id="AutoNumber1" style="border-collapse: collapse" width="100%">
 11<tr>
 12<td width="25%"> </td>
 13<td width="25%"> </td>
 14<td width="25%"> </td>
 15<td width="25%"> </td>
 16</tr>
 17<tr>
 18<td width="25%"> </td>
 19<td width="25%"> </td>
 20<td width="25%"> </td>
 21<td width="25%"> </td>
 22</tr>
 23<tr>
 24<td width="25%"> </td>
 25<td width="25%"> </td>
 26<td width="25%"> </td>
 27<td width="25%"> </td>
 28</tr>
 29<tr>
 30<td width="25%"> </td>
 31<td width="25%"> </td>
 32<td width="25%"> </td>
 33<td width="25%"> </td>
 34</tr>
 35<tr>
 36<td width="25%"> </td>
 37<td width="25%"> </td>
 38<td width="25%"> </td>
 39<td width="25%"> </td>
 40</tr>
 41<tr>
 42<td width="25%"> </td>
 43<td width="25%"> </td>
 44<td width="25%"> </td>
 45<td width="25%"> </td>
 46</tr>
 47<tr>
 48<td width="25%"> </td>
 49<td width="25%"> </td>
 50<td width="25%"> </td>
 51<td width="25%"> </td>
 52</tr>
 53<tr>
 54<td width="25%"> </td>
 55<td width="25%"> </td>
 56<td width="25%"> </td>
 57<td width="25%"> </td>
 58</tr>
 59</table>
 60</body>
 61   
 62  
 63htc文件:   
 64<public:component>
 65<public:attach event="oncontentready" onevent="Init()"></public:attach>
 66<script language="JScript">   
 67  
 68//-----------------------------------------------   
 69  
 70function Init()   
 71{   
 72for(i=0;i<element.rows.length;i++){   
 73if(i%2==0)   
 74element.rows(i).style.backgroundColor = "#0000FF";   
 75else   
 76element.rows(i).style.backgroundColor = "#FF0000";   
 77}   
 78  
 79}   
 80</script>
 81</public:component>   
 82  
 83\---------------------------------------------------------------   
 84  
 85<html>
 86<head>
 87<style>   
 88<!--   
 89table { behavior:url(table.htc); }   
 90\-->   
 91</style>
 92</head>
 93<body>
 94<table border="1" bordercolor="#111111" cellpadding="0" cellspacing="0" class="table1" id="AutoNumber1" style="border-collapse: collapse" width="100%">
 95<tr>
 96<td width="25%"> </td>
 97<td width="25%"> </td>
 98<td width="25%"> </td>
 99<td width="25%"> </td>
100</tr>
101<tr>
102<td width="25%"> </td>
103<td width="25%"> </td>
104<td width="25%"> </td>
105<td width="25%"> </td>
106</tr>
107<tr>
108<td width="25%"> </td>
109<td width="25%"> </td>
110<td width="25%"> </td>
111<td width="25%"> </td>
112</tr>
113</table>
114<table border="1" bordercolor="#111111" cellpadding="0" cellspacing="0" id="AutoNumber2" style="border-collapse: collapse" width="100%">
115<tr>
116<td width="33%"> </td>
117<td width="33%"> </td>
118<td width="34%"> </td>
119</tr>
120<tr>
121<td width="33%"> </td>
122<td width="33%"> </td>
123<td width="34%"> </td>
124</tr>
125<tr>
126<td width="33%"> </td>
127<td width="33%"> </td>
128<td width="34%"> </td>
129</tr>
130</table>
131<table border="1" bordercolor="#111111" cellpadding="0" cellspacing="0" id="AutoNumber3" style="border-collapse: collapse" width="100%">
132<tr>
133<td width="33%"> </td>
134<td width="33%"> </td>
135<td width="34%"> </td>
136</tr>
137<tr>
138<td width="33%"> </td>
139<td width="33%"> </td>
140<td width="34%"> </td>
141</tr>
142<tr>
143<td width="33%"> </td>
144<td width="33%"> </td>
145<td width="34%"> </td>
146</tr>
147</table>
148</body>
149</html>
150<public:component>
151<public:attach event="oncontentready" onevent="Init()"></public:attach>
152<script language="JScript">   
153  
154//-----------------------------------------------   
155  
156function Init()   
157{   
158if(window.document.getElementsByTagName("TABLE")[2]==element){   
159for(i=0;i<element.rows.length;i++){   
160if(i%2==0)   
161element.rows(i).style.backgroundColor = "#0000FF";   
162else   
163element.rows(i).style.backgroundColor = "#FF0000";   
164}   
165}   
166  
167}   
168</script>
169</public:component></tr>
Published At
Categories with Web编程
Tagged with
comments powered by Disqus