如何动态更改 dataTable jQuery 插件的列标题？

Question

我想更改由 jQuery Datatable 插件生成的数据表的列标题

你知道我是否可以做这样的事情：

  table = $('#example').DataTable({
        "data": source_dataTable,
        "columnDefs": defs,

    "dom": 't<"top"f>rt<"bottom"lpi><"clear">',
});
// WHAT I WANT TO DO:
    table.column(0).title.text("new title for the column 0")

？

它呈现 html 的第一行是这样的：

  <table id="example" class="row-border hover dataTable no-footer" role="grid" aria-describedby="example_info" style="width: 1140px;">
   <thead>
       <tr role="row">
              <th class="sorting" tabindex="0" aria-controls="example" rowspan="1" colspan="1" aria-label="S&amp;#233;lectionn&amp;#233;: activer pour trier la colonne par ordre croissant" style="width: 94px;">Sélectionné</th>

               <th class="sorting" tabindex="0" aria-controls="example" rowspan="1" colspan="1" aria-label="Anglais : activer pour

                  trier la colonne par ordre croissant" style="width:

62px;">Anglais </th>

</tr>
</thead>
 </table>

…

在普通表中，下面的代码有效，但对于 jQuery 插件呈现的数据表，它不会：

 $('#example tr:eq(0) th:eq(0)').text("Text update by code");

也许有 API 方法或其他 dom 方式？

原文由 Pipo 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

我找到了一个真正动态执行的解决方案

$(table.column(1).header()).text('My title');

原文由 Pipo 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

使用下面的代码。检查 演示

如果先用 td tr

   $('table tr:eq(0) td:eq(0)').text("Text update by code");

如果第一个 tr 与 th

   $('table tr:eq(0) th:eq(0)').text("Text update by code");

当使用服务端进程或想要在数据表加载所有数据后执行某些操作时使用 Draw 事件。

绘制事件- 一旦表格完成绘制就会触发

例子

 $('#example').dataTable();

 $('#example').on( 'draw.dt', function () {
   console.log( 'Redraw occurred at: '+new Date().getTime() );
   $('#example tr:eq(0) th:eq(0)').text("Text update by code");
 } );

使用回调。

drawCallback 每次 DataTables 执行绘制时调用的函数。检查 演示

   $('#example').dataTable( {
    "drawCallback": function( settings ) {
      $('#example tr:eq(0) th:eq(0)').text("Text update by code");
    }
  } );

在此处 检查所有回调选项

原文由 Nishit Maheta 发布，翻译遵循 CC BY-SA 3.0 许可协议