How to design a table that can add rows? _html/css_WEB-ITnose

  <tr>    <td>1</td>      </tr>  <tr>    <td>2</td>      </tr>  <tr>    <td>3</td>      </tr>  <tr>    <td>4</td>      </tr>  </table>

Suddenly I discovered that if the company continues to need rows in the table, how to add them?

Reply to discussion (solution)

js code: Insert rows

table.insertRow(i)//插入第（i+1）行，行数（参数）从零开始 

Dynamically add rows to the table to display information, Achieve scrolling effect

Reference jquery:

http://www.blogjava.net/absolutedo/archive/2009/03/13/259488.html

You also You can try the datagrid of easy ui, you can get data from the background, or you can call js from the front desk to add rows

http://www.jeasyui.net/demo/338.html

Simply design the table to be dynamic, and design adding rows as a method

You can refer to this case and define the method of adding rows by yourself

8b05045a5be5764f313ed5b9168a17e6
< ;html>
93f0f5c25f18dab9d176bd4f6de5d30e
09477266eebbc8a01f42387ae29e71dd
ee51bdab5c44577a55540bc1ad840f62Add row to table6e916e0f7d1e588d4f442bf645aedb2f
080b747a20f9163200dd0a7d304ba388
tr,td{
border: 1px solid gray;
}
531ac245ce3e4fe3d50054a55f265927
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
e9b182ad98608514e076f589a6038a4f
ef56e8370e073ba52174c0d9fdfd2304
a34de1251f0d9fe1e645927f19a896e8
b6c5a531a458a2e790c1fd6421739d1c1b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c1b90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
a34de1251f0d9fe1e645927f19a896e8
b6c5a531a458a2e790c1fd6421739d1c2b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c2b90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
b6c5a531a458a2e790c1fd6421739d1c3b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c3b90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
a0d1e5e3efbdbbf2ec56528a42518e182cacc6d41bbb37262a98f745aa00fbf0
4ec11beb6c39d0703d1751d203c17053
$(function(){
$("#add") .click(function(){
var row="a34de1251f0d9fe1e645927f19a896e8"
"b6c5a531a458a2e790c1fd6421739d1c4b90dd5946f0946207856a8a37f441edf"
"b6c5a531a458a2e790c1fd6421739d1c4b90dd5946f0946207856a8a37f441edf"
"fd273fcf5bcad3dfdad3c41bd81ad3e5";
$("table").append(row);
});
})
2cacc6d41bbb37262a98f745aa00fbf0
f16b1740fad44fb09bfe928bcc527e08
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e