Modify table in js processing table

Js processing table

1. Line color interval display
Css style: Two selectors
Copy codeThe Code is as follows:
<Style type = "text/css">
. One {
Background-color: #33 ffcc;
}
. Two {
Backgound-color: # ffff66;
}
</Style>
<Script type = "text/javascript">
Function trcolor ()
// Control the color of the interval rows.
{
Var tabNode = document. getElementsByTagName ("table") [0];
// Obtain the table Node
Var trs = tabNode. rows;
// Obtain all rows in the table
For (var x = 1; x <trs. length; x ++)
{
If (x % 2 = 1)
Trs [x]. className = "one ";
Else
Trs [x]. className = "two ";
}
}

// Use the onload method to run the trcolor method after the webpage is loaded to implement the row color at intervals of the table.
Window. onload = function ()
{
Trcolor ();
}
</Script>

2. Move the mouse to a row, highlight the line color, remove the line, and restore the original color.
Copy codeThe Code is as follows:
<Style type = "text/css">
. Over {
Background-color: #00ff00;
}
<Style>

<Script type = "text/javascript">
Var name;
Function trMouse ()
{
Var tabNode = document. getELementsByTagName ("table") [0];
// Add the onmouseover and onmouseout attributes to each tr tag through the for Loop
For (var x = 0; x <trs [x]. length; x ++)
{
Trs [x]. onmouseover = function ()
{
Name = this. className;
This. className = "over ";
}
Tes [x]. onmouseout = function ()
{
This. className = name;
}
}
}
</Script>