如何清空DataTable数据并重新加载更新后的JSON数据？

嘿，我来给你整理完整的操作方法，刚好对DataTable的这类操作很熟悉～

首先，你得先拿到DataTable的API实例，这里要注意用大写D的DataTable()方法，它返回的是DataTable的API对象，能直接调用各种数据操作方法：

var table = $('#example').DataTable();

一、清空当前表格数据 #

要彻底清空表格（包括页面显示和DataTable内部存储的数据），需要两步操作：

1. 用clear()清空DataTable内部的数据集
2. 用draw()重新渲染表格，让清空效果显示在页面上
   完整代码：

table.clear().draw();

要是只调用clear()不调用draw()，表格UI不会更新，看起来数据还在，所以这两步必须一起用。

二、加载更新后的JSON数据 #

清空之后，就可以把新的JSON数据加载进去了。假设你已经有了更新后的数据集updatedData，用rows.add()把数据添加到表格，再用draw()渲染出来：

// 示例更新后的JSON数据，结构要和初始化时的columns对应
var updatedData = [
  { "TaskId": "T004", "Task Description": "优化用户权限配置", "Status": "In Progress" },
  { "TaskId": "T005", "Task Description": "修复报表导出bug", "Status": "Completed" }
];

// 添加新数据并渲染
table.rows.add(updatedData).draw();

一步完成清空+加载的简洁写法 #

如果想少写一行代码，可以把清空和加载操作连起来：

table.clear().rows.add(updatedData).draw();

最后提醒下：新数据的结构一定要和你初始化表格时定义的columns字段对应上，每个数据对象都要有TaskId、Task Description、Status这几个键，不然表格会显示异常哦～

内容的提问来源于stack exchange，提问作者AJE