JS动态添加Table的TR,TD实现方法
本文实例讲述了JS动态添加Table的TR,TD实现方法。分享给大家供大家参考。具体实现方法如下:
<html> <head> <title></title> <SCRIPTlanguage="JavaScript"> vartempRow=0; varmaxRows=0; functioninsertRows(){ tempRow=table1.rows.length-1; maxRows=tempRow; tempRow=tempRow+1; varRows=table1.rows;//类似数组的Rows varnewRow=table1.insertRow(table1.rows.length);//插入新的一行 varCells=newRow.cells;//类似数组的Cells for(i=0;i<2;i++)//每行的7列数据 { varnewCell=Rows(newRow.rowIndex).insertCell(Cells.length); newCell.align="center"; switch(i) { case0:newCell.innerHTML="<tdvalign='top'>corpName</TD>";break; case1:newCell.innerHTML="<tdvalign='top'><ahref='javascript:delTableRow(\""+tempRow+"\")'>删除</a></TD>";break; } } maxRows+=1; } functiondelTableRow(rowNum){ if(table1.rows.length>rowNum){ table1.deleteRow(rowNum); } } </SCRIPT> </head> <body> <formaction=""> <tableborder="0"cellspacing="0"cellpadding="0"width="98%"align="center"> <trvalign="top"> <th> <inputvalue="添加"type="button"onclick="insertRows()"> </th> </tr> </table> <br/> <tableborder="1"width="98%"align="center"id="table1"> <tr> <th>企业名称</th> <th>操作<th> </tr> </table> </form> </body> </html>
希望本文所述对大家的javascript程序设计有所帮助。