写了一个js九九乘法表,不过这不是我要记录的重点,我发现在ie6/ie7中直接添加tr会不起任何作用,于是再将每个tr添加至tbody里就可以了,呵呵。。。其实也是,一个标准的table应该要拥有caption、thead、tbody、tfoot,当然也不是说必须要拥有,但我觉得tbody最好还是别漏,嗯。。。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style type="text/css"> body{margin:0;font:14px/1.5 tahoma;} table{border-collapse:collapse;margin:50px auto;} td{border:1px solid #ccc;padding:8px 12px;} .hide_border{border:none;} </style> <script type="text/javascript"> //如果直接在table里appendChild tr元素,那么在ie6 ie7将会没有任何效果; //解决方法:创建表格时一定要创建tbody!!! window.onload=function(){ var oTable=document.createElement('table'); var oTbody=document.createElement('tbody'); for(var i=1;i<10;i++){ var oTr=document.createElement('tr'); for(var j=1;j<10;j++){ var oTd=document.createElement('td'); if(j<=i){ oTd.innerHTML=j+'×'+i+'='+j*i; }else{ oTd.className='hide_border'; } oTr.appendChild(oTd); } oTbody.appendChild(oTr); } oTable.appendChild(oTbody); document.body.appendChild(oTable); } </script> </head> <body> </body> </html>