html动态添加序号,用js实现增加一行、删除一行，添加序号，而且在点击删除之后序号自动改变的表单...

可以通过以下步骤实现：

1. 在 HTML 中，为表格添加一个 id，并在表头中添加“序号”列。

<table id="myTable">
  <thead>
    <tr>
      <th>序号</th>
      <th>姓名</th>
      <th>年龄</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>张三</td>
      <td>20</td>
    </tr>
    <tr>
      <td>2</td>
      <td>李四</td>
      <td>22</td>
    </tr>
  </tbody>
</table>

2. 在 JavaScript 中，获取表格和添加/删除按钮的引用，并为它们添加事件处理程序。

var table = document.getElementById('myTable');
var addBtn = document.getElementById('addBtn');
var delBtn = document.getElementById('delBtn');

addBtn.addEventListener('click', addRow);
delBtn.addEventListener('click', delRow);

3. 实现添加行的函数，该函数将在表格末尾添加一行，并更新所有行的序号。

function addRow() {
  var tbody = table.getElementsByTagName('tbody')[0];
  var newRow = tbody.insertRow();

  var cell1 = newRow.insertCell(0);
  var cell2 = newRow.insertCell(1);
  var cell3 = newRow.insertCell(2);

  var rowCount = tbody.getElementsByTagName('tr').length;
  cell1.innerHTML = rowCount;
  cell2.innerHTML = '<input type="text">';
  cell3.innerHTML = '<input type="text">';

  updateIndex();
}

4. 实现删除行的函数，该函数将删除表格中最后一行，并更新所有行的序号。

function delRow() {
  var tbody = table.getElementsByTagName('tbody')[0];
  var rowCount = tbody.getElementsByTagName('tr').length;

  if (rowCount > 1) {
    tbody.deleteRow(rowCount - 1);
    updateIndex();
  }
}

5. 实现更新序号的函数，该函数将遍历表格中的所有行，并将每一行的序号更新为当前行号。

function updateIndex() {
  var tbody = table.getElementsByTagName('tbody')[0];
  var rows = tbody.getElementsByTagName('tr');

  for (var i = 0; i < rows.length; i++) {
    rows[i].getElementsByTagName('td')[0].innerHTML = i + 1;
  }
}

6. 最后，在 HTML 中添加“添加”和“删除”按钮，并将它们的 id 分别设置为“addBtn”和“delBtn”。

<button id="addBtn">添加</button>
<button id="delBtn">删除</button>

完成以上步骤后，就可以实现一个可以动态添加序号、增加一行、删除一行的表格了。