datatables中使用columns接口指定不同数据输入的列 （推荐）

链接：https://blog.csdn.net/qq_35696312/article/details/97693639

datatables是一款非常好用的基于jquery的插件，不过使用的时候有一些地方需要特别注意：

datatables既可以接受数组形式的数据也可以接受对象形式的数据，在接受完成数据之后，我们可以通过名为columns的参数来对数据的列进行一定的操作，包括添加，排序，隐藏的内容，但是两种数据格式它们在使用的时候有所区别，如下两个例子

情形1：当数据如下图所示时：

{
    "data": [
      [
        "Tiger Nixon",
        "System Architect",
        "Edinburgh",
        "5421",
        "2011/04/25",
        "$320,800"
      ],
      [
        "Garrett Winters",
        "Accountant",
        "Tokyo",
        "8422",
        "2011/07/25",
        "$170,750"
      ]
    ]
{
我们可以通过数字索引来指定每个对应的列，如下图所示，可以看到我在默认的0，1，2三列内容的基础上添加了一列内容，默认的这一列的内容 都是test，不过此刻你需要保证你的title，也就是<th>标签也要有四个，而不是三个！

 
$('#test').DataTable({
    ajax:"{% url 'disease:test' %}",
    columns:[
      {
        "data":null,
        "defaultContent":'test'
      },
      {"data":0},
      {"data":1},
      {"data":2}
    ]
 
  });

情形2： 而挡数据是如下格式的时候：

{
  "data": [
    {
      "id": "1",
      "name": "Tiger Nixon",
      "position": "System Architect",
      "salary": "$320,800",
      "start_date": "2011/04/25",
      "office": "Edinburgh",
      "extn": "5421"
    },
    {
      "id": "2",
      "name": "Garrett Winters",
      "position": "Accountant",
      "salary": "$170,750",
      "start_date": "2011/07/25",
      "office": "Tokyo",
      "extn": "8422"
    }
  ]
}
我们需要做如下的修改：

$('#example').DataTable( {
        "ajax": "data/objects.txt",
        "columns": [
            { "data": "name" },
            { "data": "position" },
            { "data": "office" },
            { "data": "extn" },
            { "data": "start_date" },
            { "data": "salary" }
        ]
    } );
可以看到，这一次我们使用的是对象中的每一个属性的名字，而不是数字索引，这一点需要特别注意!