290129-1.html (1264B)
1 <html> 2 <head> 3 <style> 4 th, td { background: #ddd; } 5 table { border-collapse: collapse; } 6 </style> 7 </head> 8 <body> 9 10 <table border="1"> 11 <tr><th>x</th><th colspan="2" class="a1 a2">A</th></tr> 12 <tr><th>x</th><td class="a1">a1</td><td class="a2">a2</td></tr> 13 </table> 14 15 <script type="text/javascript"> 16 17 function addCSSRule(selector, rule) { 18 var css = document.styleSheets[ document.styleSheets.length -1]; 19 css.insertRule(selector+" {"+rule+"}", css.cssRules.length); 20 } 21 22 function removeCSSRule(selector, rule) { 23 rule = rule.split(':'); 24 for (cssno=0; cssno<document.styleSheets.length;cssno++) { 25 var css = document.styleSheets[cssno]; 26 for (i=(css.cssRules.length-1);i>=0;i--) { 27 var rule = css.cssRules[i]; 28 if (rule.selectorText == selector && rule.style[ rule[0] ] == rule[1]) 29 css.deleteRule(i); 30 } 31 } 32 } 33 34 function setClassDisplay(display, classname) { 35 document.body.offsetWidth 36 if (display) 37 removeCSSRule("."+classname, "display:none"); 38 else 39 addCSSRule("."+classname, "display:none"); 40 } 41 42 setClassDisplay(false, 'a1'); 43 setClassDisplay(false, 'a2'); 44 setClassDisplay(true, 'a1'); 45 setClassDisplay(true, 'a2'); 46 </script> 47 48 </body> 49 </html>