See a lot of netizens on the tbody properties of the discussion, I deliberately made an example, I hope to be helpful to everyone.
<!doctype HTML PUBLIC "-//W3C//DTD HTML 4.0 transitional//en" > <ptml> <pead> <title> Scripting House tbody Tab effect Demo </title> <meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "> <meta name=" Generator "content=" EditPlus "> <meta name=" Author "content=" Tian Geng "> <meta Name= "Keywords" content= "" > <meta name= "Description" content= "" > <style type= "text/css" > Body,table,tr , td{font-size:12px; Color: #000000; }. sec1 {background-color: #99CC99; Cursor:hand; Color: #000000; border-left:1px solid #FFFFFF; border-top:1px solid #FFFFFF; border-right:1px solid Gray; border-bottom:1px solid #FFFFFF}. sec2 {background-color: #D4D0C8; Cursor:hand; Color: #000000; border-left:1px solid #FFFFFF; border-top:1px solid #FFFFFF; border-right:1px solid Gray; Font-weight:bold; }. Main_tab {background-color: #D4D0C8; Color: #000000; border-left:1px solid #FFFFFF; border-right:1px solid Gray; border-bottom:1px solid Gray; } </style> </pead> <body bgcolor= "#FFFFFF" text= "#000000" leftmargin= "0" topmargin= "0" > <table Width= "588" border= "0" cellspacing= "1" cellpadding= "4" align= "center" > <tr> <td width= "82%" > Current Location: Exhibition Hall distribution > <span id= "Weizi" ><b>A</b> Pavilion <b>1</b> Floor exhibition </span></td> <TD width= "18%" > </td> </tr> <tr> <td colspan= "2" height= "1" bgcolor= "#000000" ></td> </tr> <tr> <td colspan= "2" height= "4" ></td> </tr> <tr> <td C olspan= "2" > <table border=0 cellspacing=0 cellpadding=0 width=578 id=sectable> <tr height=20 A lign=center> <td class=sec2 width=10% onclick= "secboard (0, ' a ', ' 1 ')" >a Pavilion 1 floor showroom </td> < ; TD CLASS=SEC1 width=10% onclick= "Secboard (1, ' A ', ' 2 ')" >a Pavilion 2 floor showroom </td> <td class=sec1 width=10% onclick= "Secboard (2, ' B ', ' 1 ') ">b Pavilion 1 floor showroom </td> <td class=sec1 width=10% onclick=" Secboard (3, ' B ', ' 2 ') ">b Pavilion 2 floor showroom </td> <TD class=sec1 width=10% onclick= "Secboard (4, ' C ', ' 1 ')" >c Pavilion 1 floor Showroom </td> <TD CLASS=SEC1 W idth=10% onclick= "Secboard (5, ' C ', ' 2 ')" >c Pavilion 2 floor showroom </td> </tr> </table> <table b order=0 cellspacing=0 cellpadding=0 width=578 height=160 id=maintable class=main_tab> <tbody style= "display : Block; " > <tr> <td align= "center" > One </td> </tr> </tbody> <tbody style= "Display:none;" > <tr> <td align= "center" > Two </td> </tr> </tbody> <tbody style= "Display:none;" > <tr> <TD align= "center" > Three </td> </tr> </tbody> & Lt;tbody style= "Display:none;" > <tr> <td align= "center" > Four </td> </tr> </tbody><tbody style= "Display:none;" > <tr> <td align= "center" > Five </td> </tr> </tbody><tbody style= "Display:none;" > <tr> <td align= "center" > Six </td> </tr> </tbody> </table> </td> </tr> </table> </body> </p Tml>
[Ctrl + A full selection Note: If you need to introduce external JS need to refresh to execute]
