A very simple way to achieve the highlighted Effect of TD. _ form special effect

A very simple way to achieve the effect of adding the TD. The Code is as follows:

Function Menu_Init (obj ){
Var tds = obj. getElementsByTagName ("td ");
For (var I = 0; I <tds. length; I ++)
{
If (tds [I]. className = "MenuOptions ")
{
Tds [I]. onmouseover = switch_bg;
Tds [I]. onmouseout = switch_bg;
}
}

}
Function switch_bg (e ){
If (this. className = "MenuOptions_click") return
This. className = (this. className = "MenuOptions ")? "MenuOptions_hilite": "MenuOptions ";
}

Menu_Init (obj) is used to initialize the Table.

Required CSS

The Code is as follows:

. MenuOptions {
Padding: 2px;
Cursor: hand;
Color: #000000;
}
. MenuOptions_hilite {
Padding: 1px;
Border: outset 1px #669999;
Cursor: hand;
Color: #000000;
}

Table demonstration

The Code is as follows:

Hello, everyone.

Easy to achieve

If you like it, use it.

This cannot be highlighted

Demo

Script function Menu_Init (obj) {var tds = obj. getElementsByTagName ("td"); for (var I = 0; I <tds. length; I ++) {if (tds [I]. className = "MenuOptions") {tds [I]. onmouseover = switch_bg; tds [I]. onmouseout = switch_bg ;}} function switch_bg (e) {if (this. className = "MenuOptions_click") return this. className = (this. className = "MenuOptions ")? "MenuOptions_hilite": "MenuOptions";} script <style>. menuOptions {padding: 2px; cursor: hand; color: #000000 ;}. menuOptions_hilite {padding: 1px; border: outset 1px #669999; cursor: hand; color: #000000 ;} </style> <table id = MenuTools border = "0" cellspacing = "2" style = "border: 1px solid #000000; color: #000000; font-size: 12px "> <tr> <td class =" MenuOptions "> Hello everyone <td class =" MenuOptions "> very easy to achieve <td class =" MenuOptions "> what you like use it. <td> This cannot be highlighted </tr> </table> script Menu_Init (MenuTools) script
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]