Use jquery to dynamically Add rows to a table

Here, jquery is used. The key code is as follows:
Copy codeThe Code is as follows:
// Add a data row;
Function AddRow (){
Var vTb = $ ("# TbData"); // obtain the jquery object of table ID = TbData.
// All data rows have A. CaseRow Class to get the size of the Data row
Var vNum = $ ("# TbData tr"). filter (". CaseRow"). size () + 1; // number of data rows in the table
Var vTr = $ ("# TbData # trDataRow1"); // obtain the first row of data in the table.
Var vTrClone = vTr. clone (true); // create the first row of the copy object vTrClone
VTrClone [0]. id = "trDataRow" + vNum; // set the first Id as the index of the current region; prevent duplicate rows with multiple IDS as trDataRow1; add one at a time;
VTrClone. appendTo (vTb); // Add the copy Cell Object to the bottom of the table.
}

This method mainly uses the jquery clone function to clone a row copy of a table. Then add it to the original table.
Key Code for deleting a method:
Copy codeThe Code is as follows:
Var vNum = $ ("# TbData tr"). filter (". CaseRow"). size () + 1; // number of data rows in the table;
If (vNum <= 2)
{
Alert ('Leave at least one row ');
Return;
}
Var vbtnDel = $ (this); // get the clicked Button Object
Var vTr = vbtnDel. parent ("td"). parent ("tr"); // obtain the parent tr object;
If (vTr. attr ("id") = "trDataRow1 ")
{
Alert ('the first line cannot be deleted! '); // The first row is the basis for cloning and cannot be deleted.
Return;
} Else {
VTr. remove ();
}