利用document.createElement(), appendChild()方法可以动态创建和添加表格
<!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=gb2312" /><title>无标题文档</title></head><script type="text/javascript"> ???var index = 3; ???//行数var number = 4; ??//序号 var oTR = new Array(); ?//创建一个TR数组 ???function add(){ ??index = index+1; ??oTR[index] = document.createElement("tr"); ??//TR ??var oTD = document.createElement("<td>"); ???//创建TD ??oTD.innerHTML = number++; ??oTR[index].appendChild(oTD); ??//添加TR的子元素TD ?????oTD = document.createElement("<td> </td>") ??oTR[index].appendChild(oTD); ?????oTD = document.createElement("<td> </td>") ??oTR[index].appendChild(oTD); ?????oTD = document.createElement("<td> </td>") ??oTR[index].appendChild(oTD); ?????oTD = document.createElement("<td> </td>") ??oTR[index].appendChild(oTD); ?????document.getElementById("mytbody").appendChild(oTR[index]); ?//将TR添加到tbody中}</script><body><table border="1" width="40%" align="center"> ???<tr> ???<th>序号</th><th>询价内容</th><th>数量</th><th>单位</th><th>单价(元)</th></tr><tbody id="mytbody"> ???<tr> ??<td>1</td><td> </td><td> </td><td> </td><td> </td></tr><tr> ?<td>2</td> <td> </td><td> </td><td> </td><td> </td></tr><tr> ?<td>3</td> <td> </td><td> </td><td> </td><td> </td></tr></tbody><tr> ????<td colspan="4"> </td><td align="right"><a href="javascript:add()">+增加</a></td></tr></table></body></html>???????????
再分享一下我老师大神的人工智能教程吧。零基础！通俗易懂！风趣幽默！还带黄段子！希望你也加入到我们人工智能的队伍中来！https://blog.csdn.net/jiangjunshow
JS动态添加表格 一
原文地址：https://www.cnblogs.com/skiwnchqhh/p/10339028.html