一般情况下，对表格中的数据进行“增删改”操作，都是直接操作数据库。现在有些项目因为设计或者优化的缘故，不对表格中的数据进行“增删改”，而是通过最后“保存”按钮的操作，一次性将数据传至服务器，由服务器对数据进行“增删改”。
以下通过给用户分配角色这样的功能进行说明。
操作界面大致如下（直接手画，略显粗糙，能看明白就行）：
说明：
“新增”、“修改”和“删除”都不是直接操作数据库。
点击“保存”时才将数据传给服务器。
此项目中的删除均为逻辑删除（即，只是对数据打上“删除”状态的标记），不是物理删除。
文中说的“ID”为用户角色的主键。
第一种方法：先删后增
直接删除用户下的所有角色，将前端传过来的数据统一新增。
优缺点：
优点：逻辑简单，容易实现。
缺点：会产生大量的删除数据。
第二种方法：通过有无 ID 进行操作判断
过滤数据：通过 stream 过滤出无 ID 的数据和有 ID 的数据。
新增：无 ID 的数据均为新增的数据，在服务器中直接对这些数据进行新增操作即可。
 修改和删除：查询出用户所有的角色，将查询出来的ID（ID_A）与前端传过来的有ID的数据（ID_B）进行比对，交集（即 ID_A 与 ID_B都有的数据）即为修改，差集（即 ID_A 有的数据，在 ID_B 中没有）即为删除。
优缺点：
优点：影响的数据量较少
缺点：实现起来比较复杂
第三种方法：前端部分分类
前端分类：前端将被逻辑删除的数据保存在 delete 对象中。
数据上传：将表格中的数据（包含有新增的数据和修改的数据）和 delete 对象中的数据一起上传至服务器。
后端分类：将表格中的数据分为有 ID 的数据和无 ID 的数据。
增删改操作：无 ID 的数据进行新增，有 ID 的数据进行修改，delete 对象中的数据进行删除。
优缺点：
优点：影响的数据量较少，前端的分类操作比较容易，后端的分类操作和增删改操作也比较容易。
缺点：后端仍需要进行分类操作。
第四种方法：前端全分类
前端分类：前端将需要进行新增、修改和删除的数据分别放到 add 对象、update 对象 和 delete 对象中。
数据上传：将分类之后的数据上传至服务器。
后端增删改操作：对 add 对象中的数据进行新增，对 update 对象中的数据进行修改，对 delete 对象中的数据进行删除。
优缺点：
优点：影响的数据量较少，后端容易实现。
缺点：前端实现较难。

js 动态生成表格
文章分类:Web前端


javascript控制table


var table = document.getElementById("tableId")
增加一行：table.insertRow()   //默认添加到最后一行，添加到指定行用insertRow(index)方法
删除一行：table.deleteRow() //默认删除最后一行，删除指定行用deleteRow(index)方法
增加一列：table.insertCell()   //默认添加到最后一列，添加到指定列用insertCell(index)方法
删除一列：table.deleteCell()   //默认删除最后一列，删除指定列用deleteCell(index)方法
统计列数：table.rows.item(0).cells.length
统计行数：table.rows.length
设置单元格colspan：cell.colSpan=2 //注意区分大小写， 如果写colspan会报错
获得单元格宽：table.rows[0].cells[0].offsetWidth
获得单元格高：table.rows[0].cells[0].offsetHeight
设置单元格高度：talbe.rows[0].cells[0].width = xxx
设置单元格背景颜色：table.rows[0].cells[0].style.background="red"


 
说明：
附录：
insertRow() 方法用于在表格中的指定位置插入一个新行。

语法
tableObject.insertRow(index)

返回值
返回一个 TableRow，表示新插入的行。

说明
该方法创建一个新的 TableRow 对象，表示一个新的 <tr> 标记，并把它插入表中的指定位置。
新行将被插入 index 所在行之前。若 index 等于表中的行数，则新行将被附加到表的末尾。
如果表是空的，则新行将被插入到一个新的 <tbody> 段，该段自身会被插入表中。

抛出
若参数 index 小于 0 或大于等于表中的行数，该方法将抛出代码为 INDEX_SIZE_ERR 的 DOMException 异常。

        Markdown是一种轻量级标记语言，排版语法简洁，让人们更多地关注内容本身而非排版。它使用易读易写的纯文本格式编写文档，可与HTML混编，可导出 HTML、PDF 以及本身的 .md 格式的文件。因简洁、高效、易读、易写，Markdown被大量使用，如Github、Wikipedia等网站，如各大博客平台：WordPress、Drupal、简书等。

       千万不要被「标记」、「语言」吓到，Markdown的语法十分简单，常用的标记符号不超过十 个，用于日常写作记录绰绰有余，不到半小时就能完全掌握。

就是这十个不到的标记符号，却能让人优雅地沉浸式记录，专注内容而不是纠结排版， 达到「心中无尘，码字入神」的境界。

1 编辑器和阅读器

在线编辑器：Markdown在线编辑器

离线编辑器：推荐使用Typora

vs2019编辑MarkDown：使用Markdown Editor扩展

2 MarkDown语法

Markdown 语法