javascript 表格左右收缩

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> 左右收缩表格 </TITLE> 
<meta http-equiv="content-type" content="text/html;charset=gb2312"> 
<img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20language%3D%22JavaScript%22%20type%3D%22text%2Fjavascript%22%3E%20%0D%0Afunction%20tableOnLoad()%20%0D%0A%7B%20%0D%0Avar%20tableObj%3Ddocument.getElementById(%22testTable%22)%3B%20%0D%0Avar%20colNumber%3DtableObj.rows.item(0).cells.length%3B%20%0D%0Avar%20colObjs%3DtableObj.getElementsByTagName(%22td%22)%3B%20%0D%0Aif(colNumber%3E5)%20%0D%0A%7B%20%0D%0Afor(var%20i%3D5%3Bi%3CcolObjs.length%3Bi%2B%2B)%20%0D%0A%7B%20%0D%0AcolObjs(i).style.display%3D%22none%22%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afunction%20tableLeftRetract()%20%0D%0A%7B%20%0D%0Avar%20tableObj%3Ddocument.getElementById(%22testTable%22)%3B%20%0D%0Avar%20colNumber%3DtableObj.rows.item(0).cells.length%3B%20%0D%0Avar%20colObjs%3DtableObj.getElementsByTagName(%22td%22)%3B%20%0D%0A%2F%2FminNumber%20of%20column%20of%20which%20display%20style%20is%20none%20%0D%0Avar%20minNumber%3D0%3B%20%0D%0Afor(var%20i%3D0%3Bi%3CcolNumber%3Bi%2B%2B)%20%0D%0A%7B%20%0D%0Aif(colObjs(i).style.display!%3D%22none%22)%20%0D%0A%7B%20%0D%0AminNumber%3Di%3B%20%0D%0Abreak%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Aif(minNumber%3C%3DcolNumber-1-5%20%26%26%20colNumber%3E5)%7B%20%0D%0Afor(var%20m%3D0%3Bm%3C%3DminNumber%3Bm%2B%2B)%20%0D%0A%7B%20%0D%0AcolObjs(m).style.display%3D%22none%22%3B%20%0D%0A%7D%20%0D%0Afor(var%20n%3DminNumber%2B1%3Bn%3CminNumber%2B1%2B5%3Bn%2B%2B)%20%0D%0A%7B%20%0D%0AcolObjs(n).style.display%3D%22%22%3B%20%0D%0A%7D%20%0D%0Afor(var%20j%3DcolNumber-1%3Bj%3EminNumber%2B5%3Bj--)%20%0D%0A%7B%20%0D%0AcolObjs(j).style.display%3D%22none%22%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afunction%20tableRightRetract()%20%0D%0A%7B%20%0D%0Avar%20tableObj%3Ddocument.getElementById(%22testTable%22)%3B%20%0D%0Avar%20colNumber%3DtableObj.rows.item(0).cells.length%3B%20%0D%0Avar%20colObjs%3DtableObj.getElementsByTagName(%22td%22)%3B%20%0D%0A%2F%2FminNumber%20of%20column%20of%20which%20display%20style%20is%20none%20%0D%0Avar%20maxNumber%3DcolNumber-1%3B%20%0D%0Afor(var%20i%3DcolNumber-1%3Bi%3E%3D0%3Bi--)%20%0D%0A%7B%20%0D%0Aif(colObjs(i).style.display!%3D%22none%22)%20%0D%0A%7B%20%0D%0AmaxNumber%3Di%3B%20%0D%0Abreak%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Aif(maxNumber%3E%3D5%20%26%26%20colNumber%3E5)%7B%20%0D%0Afor(var%20m%3DcolNumber-1%3Bm%3E%3DmaxNumber%3Bm--)%20%0D%0A%7B%20%0D%0AcolObjs(m).style.display%3D%22none%22%3B%20%0D%0A%7D%20%0D%0Afor(var%20n%3DmaxNumber-1%3Bn%3EmaxNumber-1-5%3Bn--)%20%0D%0A%7B%20%0D%0AcolObjs(n).style.display%3D%22%22%3B%20%0D%0A%7D%20%0D%0Afor(var%20j%3DmaxNumber-1-5-1%3Bj%3E%3D0%3Bj--)%20%0D%0A%7B%20%0D%0AcolObjs(j).style.display%3D%22none%22%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> 
</head> 
<body> 
<table> 
<tr> 
<td><img src="left.jpeg" _ewebeditor_ta_src="left.jpeg" onClick="tableLeftRetract();"/></td> 
<td> 
<table id="testTable"> 
<tr> 
<td>col1</td> 
<td>col2</td> 
<td>col3</td> 
<td>col4</td> 
<td>col5</td> 
<td>col6</td> 
<td>col7</td> 
<td>col8</td> 
<td>col9</td> 
<td>col10</td> 
</tr> 
</table> 
</td> 
<td><img src="right.jpeg" _ewebeditor_ta_src="right.jpeg" onClick="tableRightRetract();"/></td> 
</tr> 
</table> 
<img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%3EtableOnLoad()%3B%3C%2Fscript%3E"> 
</body> 
</html>

　　 [Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

教程首页更多教程