HTML Table 动态增加 删除 行 code 实例
来源：互联网 发布：mac windows 截屏 编辑：程序博客网 时间：2024/04/29 13:53
<html><head><title>Dynamic Table</title><script type="text/javascript">function addRow(tbodyID){var bodyObj=document.getElementById(tbodyID);if(bodyObj==null) {alert("Body of Table not Exist!");return;}var rowCount = bodyObj.rows.length;var cellCount = bodyObj.rows[0].cells.length;var newRow = bodyObj.insertRow(rowCount++); for(var i=0;i<cellCount;i++){ var cellHTML = bodyObj.rows[0].cells[i].innerHTML; if(cellHTML.indexOf("none")>=0) { cellHTML = cellHTML.replace("none",""); } newRow.insertCell(i).innerHTML=cellHTML;}}function removeRow(inputobj){if(inputobj==null) return;var parentTD = inputobj.parentNode;var parentTR = parentTD.parentNode;var parentTBODY = parentTR.parentNode;parentTBODY.removeChild(parentTR);}</script></head><body><table> <tbody id="tbody1"> <tr> <td> <input type="text" size="40"/> </td> <td> <input style="display:none" mce_style="display:none" type="button" value="Delete" onClick="removeRow(this)"/> </td> </tr> </tbody> <tr> <td> <input type="button" value="Add Row" onClick="addRow('tbody1')"/> </td> <td> </td> </tr></table></body></html>
