在WEB项目中有些输入数据的地方，由于数据比较多，经常会遇到要求能动态的增加输入的行数，可以更便捷的往系统中录入数据。这时就经常会使用的通过javascript动态增加（或删除）table的1行。下面把以前自己用的例子贴出来，在ie和firefox下都可以正常运行，有兴趣的朋友也可以参考下。
实例图如下：
 
例子example.html内容：
Html代码 
1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
2. <html><head><title>动态表格</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
3. <link href="default.css" type="text/css" rel="stylesheet" /> 
4. <script language="JavaScript" src="autotable.js"></script> 
5. </head><body bgcolor="#FFFFFF" topmargin="15px" leftmargin="5px" rightmargin="5px">       
6. <center><b>动态表格</b></center> 
7. <script> 
8. //定义动态表的id  
9. var autoTableId="idMultiTable";  
10. //定义动态表中每一行的数据  
11. var autoTableRowData=new Array(  
12. '<a href="#" name="deleteRow">删除</a>',  
13. '<input type="text" size="12" name="name" id="name" value="">',  
14. '<input type="text" size="35" name="address" id="address" value="">',  
15. '<a href="#" name="insertRow">添加</a>'  
16. );  
17. //定义添加按钮的name属性  
18. var addTableRowName="insertRow";  
19. //定义删除按钮的name属性  
20. var delTableRowName="deleteRow";  
21. </script> 
22.                   
23. <table class="tabelBoder" id="idMultiTable" width="100%" align="center" cellspacing="0" cellpadding="3" border="0"> 
24. <tr height="30" class="RH1"> 
25. <td width="4%" align="left">&nbsp;</td> 
26. <td width="17%" align="left">姓名</td> 
27. <td width="23%" align="left">地址</td> 
28. <td width="11%" align="left">&nbsp;</td> 
29. </tr> 
30. <tr class="N1" οnmοuseοver="this.className='N2'" οnmοuseοut="this.className='N1'"> 
31. <td class="DN"><a href="#" name="deleteRow">删除</a></td> 
32. <td class="DN"><input type="text" size="12" name="name" id="name" value="" ></td> 
33. <td class="DN"><input type="text" size="35" name="address" id="address" value="" ></td> 
34. <td class="DN"><a href="#" name="insertRow">添加</a></td> 
35. </tr> 
36. </table> 
37. <table width="100%" align="center" cellspacing="0" cellpadding="3" border="0"> 
38. <tr height="30"><td align="left" ><input type="button" name="button" class="btn" value="添加"
39. </table> 
40. <script>setAddFunction();</script> 
41. </body></html> 

用到的autotable.js内容：
Js代码 
1. //添加1行  
2. function addTableRow(rowIndex)  
3. {  
4.     var tbobj=document.getElementById(autoTableId);  
5.     var trobj,tdobj;  
6.     if(rowIndex==-1){  
7.         trobj=tbobj.insertRow(-1);  
8.     }else{  
9.         trobj=tbobj.insertRow(rowIndex+1);  
10.     }  
11.     trobj.className="N1";  
12.     trobj. Function("this.className='N2';");  
13.     trobj. Function("this.className='N1';");  
14.     for(var i=0;i<autoTableRowData.length;i++){  
15.         tdobj=trobj.insertCell(-1);  
16.         tdobj.className="DN";  
17.         tdobj.innerHTML=autoTableRowData[i];  
18.     }  
19.     //重新定义
20.     setAddFunction();  
21. }  
22. //删除1行  
23. function delTableRow(rowIndex){  
24.     var tbobj=document.getElementById(autoTableId);  
25.     if(rowIndex==-1){  
26.         if(tbobj.rows.length>1){  
27.             tbobj.deleteRow(tbobj.rows.length-1);  
28.         }  
29.     }else{  
30.         tbobj.deleteRow(rowIndex);  
31.     }  
32. }  
33. //定义添加和删除动态行的
34. function setAddFunction(){  
35.     var addNames = document.getElementsByName(addTableRowName);  
36.     for(var i=0;i<addNames.length;i++){  
37.         addNames[i]. Function("addTableRow(this.parentNode.parentNode.rowIndex);");  
38.     }  
39.     var delNames = document.getElementsByName(delTableRowName);  
40.     for(var i=0;i<delNames.length;i++){  
41.         delNames[i]. Function("delTableRow(this.parentNode.parentNode.rowIndex);");  
42.     }  
43. }