This example describes the TR and TD implementation method of dynamically adding Table by JS. Share it for your reference. The specific implementation method is as follows:
Copy the code as follows: <html>
<head>
<title></title>
<SCRIPT language="JavaScript">
var tempRow=0;
var maxRows=0;
function insertRows(){
tempRow=table1.rows.length-1;
maxRows=tempRow;
tempRow=tempRow+1;
var Rows=table1.rows;//Array-like Rows
var newRow=table1.insertRow(table1.rows.length);//Insert a new row
var Cells=newRow.cells;//Array-like Cells
for (i=0;i<2;i++)//7 columns of data per row
{
var newCell=Rows(newRow.rowIndex).insertCell(Cells.length);
newCell.align="center";
switch (i)
{
case 0: newCell.innerHTML="<td valign='top'>corpName</TD>"; break;
case 1 : newCell.innerHTML="<td valign='top'><a href='javascript:delTableRow(/""+tempRow+"/")'>Delete</a></TD>"; break;
}
}
maxRows+=1;
}
function delTableRow(rowNum){
if (table1.rows.length >rowNum){
table1.deleteRow(rowNum);
}
}
</SCRIPT>
</head>
<body>
<form action="">
<table cellpacing="0" cellpadding="0" align="center">
<tr valign="top">
<th>
<input value="Add" type="button" onclick="insertRows()">
</th>
</tr>
</table>
<br />
<table align="center" id="table1">
<tr>
<th >Company Name</th>
<th>Operation<th>
</tr>
</table>
</form>
</body>
</html>
I hope this article will be helpful to everyone's JavaScript programming.