This paper illustrates the TR,TD implementation method of JS dynamic adding table. Share to everyone for your reference. The implementation methods are as follows:
Copy Code code as follows:
<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;//Rows similar to arrays
var newrow=table1.insertrow (table1.rows.length);//Insert a new row
var cells=newrow.cells;//an array-like Cells
for (i=0;i<2;i++)//7 column 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>
<body>
<form action= "" >
<table border= "0" cellspacing= "0" cellpadding= "0" width= "98%" align= "Center" >
<TR valign= "Top" >
<th>
<input value= "Add" type= "button" onclick= "InsertRows ()" >
</th>
</tr>
</table>
<br/>
<table border= "1" width= "98%" align= "center" id= "table1" >
<tr>
<th > Company Name </th>
<th> Operations <th>
</tr>
</table>
</form>
</body>
I hope this article will help you with your JavaScript programming.