一 介绍
删除表格的指定表格行使用HTMLTableElement对象的如下方法:deleteRow
删除表格行的指定单元格使用HTMLRowElement对象的如下方法:deleteCell
二 代码
<!DOCTYPE html> <html> <head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)"/> <meta http-equiv="Content-Type" content="text/html; charset=GBK"/> <title>删除表格的行和格</title> </head> <body> <input id="delrow" type="button" value="删除表格最后一行" onclick="delrow();"/><br /> <input id="delcell" type="button" value="删除最后一行的最后一格" onclick="delcell();"/><br /> <table id="test" border="1" style="width:400px;"> <caption>疯狂Java体系</caption> <tr> <td>疯狂Java讲义</td> <td>轻量级Java EE企业应用实战</td> </tr> <tr> <td>疯狂Ajax讲义</td> <td>经典Java EE企业应用实战</td> </tr> <tr> <td>疯狂XML讲义</td> <td>疯狂Android讲义</td> </tr> </table> <script type="text/javascript"> // 获取目标表格 var tab = document.getElementById("test"); // 删除行的函数 var delrow =function() { if(tab.rows.length >0) { // 删除最后一行 tab.deleteRow(tab.rows.length -1); } } // 删除目标表格的最后一格 var delcell =function() { // 获取表格的所有行 var rowList = tab.rows; // 获取表格的最后一行 var lastRow = rowList.item(rowList.length -1); if(lastRow.cells.length >0) { // 删除表格的最后一格 lastRow.deleteCell(lastRow.cells.length -1); } } </script> </body> </html>
三 运行结果