|
以下是javascript动态增加删除表格列的代码： <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title></title> <script type="text/javascript" src="js/common.js"></script> <script language="javascript"> function addrows(index){ var trArray = document.getElementsByTagName("tr"); var count = 0; for(var i = 0 ; i < trArray.length ; i++) { var trrows = document.getElementsByTagName("tr")[i]; //alert(index); var tdcols = trrows.insertCell(index); if(count == i ) { tdcols.innerHTML ='the'+(i+1)+'cols'; } count++; } }
function delrows() { var tdArray = document.getElementsByName("add"); while(tdArray.length!=0) { for(var i = 0 ; i < tdArray.length ; i++) { var td = tdArray[i]; td.parentNode.removeChild(td); tdArray = document.getElementsByName("add"); } } } </script> </head> <body> <input type="checkbox" name="addrow1" onclick="addrows(0,'td0')"/> <input type="checkbox" name="addrow1" onclick="addrows(2,'td2')"/> <input type="checkbox" name="addrow1" onclick="addrows(3,'td3')"/> <input type="button" value="delete" onclick="delrows()"> <table border="1"> <tr name="one"> <td id="add">tr2/td4</td> <td>hello</td> <td>hello</td> <td>hello</td> </tr> <tr name="two"> <td id="add">tr3/td4</td> <td>hello2</td> <td>hello</td> <td>hello</td> </tr> <tr name="one"> <td id="add">tr2/td4</td> <td>hello</td> <td>hello</td> <td>hello</td> </tr> <tr name="three"> <td id="add">tr3/td4</td> <td>hello2</td> <td>hello</td> <td>hello</td> </tr> <tr name="four"> <td id="add">tr2/td4</td> <td>hello</td> <td>hello</td> <td>hello</td> </tr> <tr name="five"> <td id="add">tr3/td4</td> <td>hello2</td> <td>hello</td> <td>hello</td> </tr> </table> </body> </html> |