<html>
<head>
    <title></title>    <script language="javascript">function show(obj)
{
obj.style.backgroundColor='red';
}
function re(obj)
{
obj.style.backgroundColor='#fff';
}
    </script></head>
<body>
    <table border="1">
        <tr onmouseover="show(this)" onmouseout="re(this)">
            <td>111111111
            </td>
            <td>111111111
            </td>
        </tr>
        <tr onmouseover="show(this)" onmouseout="re(this)">
            <td>222222222222
            </td>
            <td>22222222222222
            </td>
        </tr>
        <tr onmouseover="show(this)" onmouseout="re(this)">
            <td>33333333333
            </td>
            <td>333333333333
            </td>
        </tr>
        <tr onmouseover="show(this)" onmouseout="re(this)">
            <td>444444444444
            </td>
            <td>4444444444444
            </td>
        </tr>
    </table>
</body>
</html>

解决方案 »

  1.   

    <html><head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>新建网页 4</title>
    <SCRIPT language=javascript>
    function changeColor(){
    var trs=document.getElementsByTagName("tr");
    for(var i=0;i<trs.length;i++){
     trs[i].onmouseover=function(){this.style.background="#369";};
     trs[i].onmouseout=function(){this.style.background=(i=!i)?"#fff":"#ccc";};
    }
    }
    window.onload=changeColor;
    </SCRIPT>
    <style type='text/css'>
    .newcolor{background-color:#ccc;}
    table{border:1px solid #000;
             border-collapse : collapse ;
    }
    </style>
    </head><body >
    <form method='post' action='' >
    <table height='300px' id='one'>
    <tr width='400px' class='newcolor'>
    <td width='200px'></td>
    <td width='200px'></td>
    </tr>
    <tr>
    <td></td>
    <td></td>
    </tr>
    <tr class='newcolor'>
    <td></td>
    <td></td>
    </tr>
    <tr>
    <td></td>
    <td></td>
    </tr>
    <tr class='newcolor'>
    <td></td>
    <td></td>
    </tr>
    </table>
    </form>
    </body></html>