html怎么在页面上加入增加行的按钮

1、打开Sublime text3，新建一个HTML文档，并且建立好框架。

2、 <table> <tr> <td>Student</td> <td><input type="text" name="student"></td> </tr> <tr> <td>Height</td> <td><input type="text" name="height"></td> </tr> <tr> <td colspan=2> <input type="button" name="add" value="add"> </td> </tr> </table>现在我们设立一下两行文本输入框，并且提示可以增加的按钮。

3、<table id="mainTable">为标签加上id方便定位。

4、加上监听事件的函数。onclick="adding()"然后连接js文档。<script src="test.js"></script>

5、functio艘绒庳焰n adding(){ var table = document.getElementById("m锾攒揉敫ainTable"); var addTr = table.insertRow(2);}创建函数，然后我们设定两个变量。一个用于定位标签位置，另一个增加行数在第二行。测试一下，多次点击确实会往下移动。

6、var addTd = addTr.insertCell(); addTd.innerHTML = "新增";除了要增加tr还要增加td，并且增加文本提示。

7、稍微修改一下变量名字。再增加文本输入框。function adding(){ var ta水瑞侮瑜ble = document.getElementById("mainTable"); var addTr = table.insertRow(2); var td1 = addTr.insertCell(); td1.innerHTML = "新增"; var td2 = addTr.insertCell(); td2.innerHTML = "<input type='text 'name='newnew' >";}这个时候就会发现点击按钮就会增加一行，多次就会多行。