读书人

每行间距显示颜色

发布时间: 2012-09-27 11:11:17 作者: rapoo

每行间隔显示颜色

<!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=utf-8" /><title>无标题文档</title><link rel="stylesheet" href="tab.css" /><style type="text/css">.one{background-color:#33FFCC;}.two{background-color:#FFFF66;}.over{background-color:#00FF00;}</style><script type="text/javascript" src="../Day26/doctool.js"></script><script type="text/javascript">//行颜色间隔显示function trcolor(){var tabNode = byTag("table")[0];var trs = tabNode.rows;for(var x=1; x<trs.length; x++){if(x%2==1)trs[x].className = "one";elsetrs[x].className = "two";trs[x].onmouseover = function(){name = this.className;this.className = "over";};trs[x].onmouseout = function(){this.className = name;}}}var name;/*function over(trNode){name = trNode.className;trNode.className = "over";}function out(trNode){trNode.className = name;}*/window.onload = trcolor;</script></head><body><table><tr>    <th>姓名</th>        <th><a href="javascript:void(0)" onclick="sorttab()">年龄</a></th>        <th>地址</th>    </tr>        <tr>    <td>张三</td>        <td>30</td>        <td>北京</td>    </tr>    <tr>    <td>李四</td>        <td>4</td>        <td>上海</td>    </tr>    <tr>    <td>王武</td>        <td>23</td>        <td>广州</td>    </tr>    <tr>    <td>赵六</td>        <td>27</td>        <td>南京</td>    </tr>    <tr>    <td>周七</td>        <td>25</td>        <td>大连</td>    </tr>    <tr>    <td>孙八</td>        <td>29</td>        <td>铁岭</td>    </tr>    <tr>    <td>赵六</td>        <td>27</td>        <td>南京</td>    </tr>    <tr>    <td>周七</td>        <td>25</td>        <td>大连</td>    </tr>    <tr>    <td>孙八</td>        <td>29</td>        <td>铁岭</td>    </tr></table></body></html>

?

读书人网 >Web前端

热点推荐