jquery可实现html表格的增删改查：添加用.append()追加行并清空输入框；删除用事件委托绑定.del-btn；编辑通过双击替换为input；保存则遍历数据行转json发送后端。
用jQuery快速增删改查HTML表格里的数据，不用刷新页面就能实时更新内容，适用于订单管理、用户列表、库存台账等后台界面。
动态添加一行新数据
第一步：在页面上准备一个带ID的空表格和一组输入框（如姓名、邮箱、电话），再加一个“添加”按钮。
第二步：给按钮绑定点击事件，用$("table").append()插入新行，内容从输入框取值，拼成<tr>
<td>xxx</td>
<td>yyy</td>
<td><button class="'del-btn'">删</button></td>
</tr>字符串。
第三步：插入后清空所有输入框，避免重复提交相同内容。注意：不要用.html()直接覆盖整个表格，否则会丢失已绑定的事件监听器——【必须用.append()或.prepend()追加】。
点击按钮删除当前行
方法一（推荐）：给删除按钮统一加class="del-btn"，用事件委托绑定到table上：
$("table").on("click", ".del-btn", function() { $(this).closest("tr").remove(); }); 这样即使后续动态添加的行也能响应删除。
方法二（不推荐）：对每个按钮单独绑定.click()，但新增行后需重新绑定，容易漏绑且性能差。
双击单元格进入编辑模式
① 给所有数据单元格（table td:not(:first-child):not(:last-child)）绑定双击事件；
jQuery 1.12.4是jQuery 1.x系列的最后一个正式稳定版本，由jQuery团队于2016年发布。该版本主要面向需要兼容旧版浏览器环境的网站和Web应用，尤其适用于仍需支持Internet Explorer 6、Internet Explorer 7、Internet Explorer 8等老旧浏览器的项目。
② 触发时用$(this).text()获取原内容，替换成<input type="text" value="xxx">并自动聚焦；
③ 按Enter或失焦时，把输入框的.val()写回单元格文本，并恢复为普通<td>；<p>注意：表头行（<code>th）和操作列（含按钮）不能编辑，否则会破坏结构——【务必排除第一列和最后一列】。
保存修改后的整张表格数据
用$("table tr:gt(0)").map()遍历所有数据行（跳过表头），对每行执行：
return $(this).find("td").map(function() { return $(this).text(); }).get();
得到二维数组后，用JSON.stringify()转成字符串，通过$.post()发送到后端接口。
这一步操作起来很简单，直接把生成的JSON发过去就行，但要确保后端能接收application/x-www-form-urlencoded或application/json格式。
