Home > Developer > JavaScript
Copy codeThe Code is as follows:
<Script type = "text/javascript">
Var name; // class name that stores the tr object. It is restored when you move the mouse away.
Function trcolor () {// table row color interval display
Var tabNode = document. getElementsByTagName ("table") [0];
Var trNodes = tabNode. rows;
For (var x = 1; x <trNodes. length; x ++ ){
If (x % 2 = 1)
TrNodes [x]. className = "one ";
Else
TrNodes [x]. className = "two ";
TrNodes [x]. onmouseover = function () {// highlighted
Name = this. className;
This. className = "over ";
}
TrNodes [x]. onmouseout = function () {// tr object add onmouseout event attribute
This. className = name;
}
}
}
Window. onload = trcolor;
</Script>
<Style type = "text/css">
Table {width: 60%; border: solid 1px # 0066FF ;}
Table td {border: solid 1px # 0099ff ;}
A {text-decoration: none ;}
. One {background-color: red ;}
. Two {background-color: blue ;}
. Over {background-color: yellow ;}
</Style>
</Head>
<Body>
<Table>
<Tr>
<Td> name </td> <td> age </td> <td> address </td>
</Tr>
<Tr>
<Td> Zhang San </td> <td> 23 </td> <td> Beijing </td>
</Tr>
<Tr>
<Td> Li Si </td> <td> 25 </td> <td> Shanghai </td>
</Tr>
<Tr>
<Td> Wang Wu </td> <td> 15 </td> <td> Guangzhou </td>
</Tr>
<Tr>
<Td> Tang Zong </td> <td> 20 </td> <td> Changsha </td>
</Tr>
</Table>
</Body>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
