Datatable中columnDefs的targets能否实现动态使用？

当然可以实现！DataTables 对 columnDefs.targets 的支持非常灵活，直接引用全局数组 hide_them 完全可行，但要注意几个关键细节，确保动态更新后能正确生效。

1. 初始化时直接绑定全局数组 #

你给出的示例写法本身是成立的，只要 hide_them 在 DataTables 初始化前已经有合法的列号值（注意列号从 0 开始计数），初始化时就能自动识别这些列并应用自定义渲染逻辑。举个实际例子：

// 全局数组：指定要自定义渲染的列索引
let hide_them = [1, 3]; // 对应表格的第2、第4列

// 初始化DataTable
$('#myTable').DataTable({
  columnDefs: [{
    targets: hide_them,
    render: function(data, type, row) {
      // 自定义渲染逻辑：比如仅在页面展示时隐藏内容，不影响排序/筛选
      return type === 'display' ? '<span style="display:none;">' + data + '</span>' : data;
    }
  }],
  // 其他表格配置...
});

2. 动态更新数组后刷新表格 #

如果 hide_them 是在表格初始化后才更新的，直接修改数组不会自动触发表格重新渲染。这时候有两种高效的处理方式：

方式一：销毁重建表格（适合配置变动较大的场景）

// 触发数组更新的函数示例
function updateTargetColumns() {
  // 更新全局数组
  hide_them = [0, 2];
  
  // 获取当前表格实例
  const table = $('#myTable').DataTable();
  // 销毁旧实例
  table.destroy();
  // 重新初始化表格，此时会使用更新后的hide_them
  $('#myTable').DataTable({
    columnDefs: [{
      targets: hide_them,
      render: function(data, type, row) {
        return type === 'display' ? '<span class="text-muted">' + data + '</span>' : data;
      }
    }],
    // 保留原有数据和配置
    data: table.data().toArray()
  });
}

方式二：直接操作列DOM（轻量更新，无需重建）

如果只是修改渲染样式/内容，不需要调整表格核心配置，可以直接定位目标列的DOM元素修改：

function applyDynamicRender() {
  const table = $('#myTable').DataTable();
  // 遍历目标列索引，逐个处理单元格
  hide_them.forEach(colIndex => {
    table.column(colIndex).nodes().to$().each(function() {
      // 直接修改单元格内容或样式
      $(this).html('<span style="opacity:0.5;">' + $(this).text() + '</span>');
    });
  });
}

只要在 hide_them 更新后调用这个函数，就能立即生效。

3. 注意事项 #

• 列索引是从 0 开始的，别和可视化的列序号混淆；
• 自定义 render 函数时，建议通过 type 参数区分渲染场景（display/filter/sort），避免影响表格的排序、筛选功能；
• 如果全局数组可能为空，记得添加判断逻辑，避免出现无效的列定义。

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