<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "xml:lang=" en "lang=" en "> <pead> <title></titl e> <style type= "Text/css" > class1{background: #efefef; Text-align:center; width:80px; }. class2{background: #ffcc00; Text-align:center; width:80px; }. class3{background: #ffffff; }. class4{background: #ffff00; } </style> <script type= "Text/javascript" > Function addevent (Elm, Evtype, FN, usecapture) { if (Elm.addeventlistener) {Elm.addeventlistener (Evtype, FN, usecapture); return true; else if (elm.attachevent) {var r = elm.attachevent ("On" +evtype, FN); return R; else {alert ("Handler could not being removed"); } function Inittd () {var sections=document.getelementsbytagname ("TD"); for (Var i=0;i<sections.length;i++) {var section=sections[i]; if (Section.getattribute ("t") = = "Yes") {section.classname= "Class1"; Section.nextsibling.classname= "CLASS3"; Addevent (section, "click", changetd); }} function changetd (EV) {var ev=ev| | window.event; var evt=ev.srcelement| | Ev.target; if (evt.tagname== "TD" &&evt.getattribute ("t") = = "Yes") {var sections=document.getelementsbytagname ("TD") ; for (Var i=0;i<sections.length;i++) {var section=sections[i]; if (Section.getattribute ("t") = = "Yes") {section.classname= "Class1"; Section.nextsibling.classname= "CLASS3"; Evt.classname= "Class2"; Evt.nextsibling. classname= "CLASS4"; "}} </script> </pead> <body> <table cellpadding=" 0 "cellspacing= "0" border= "1" bordercolor= "#cccccc" align= "center" width= "> <tr><td t=" yes ">a</td><td >this is section a</td></tr> <tr><td t= "yes" >b</td><td>this are section b</td ></tr> <tr><td t= "yes" >c</td><td>this is section c</td></tr> <tr> <TD t= "Yes" >d</td><td>this is section d</td></tr> </table> <script type= "text/" JavaScript "> Inittd (); </script> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
