如何从数据表中导出非文本内容答案

【问题标题】：How to export non-text content from a Datatable如何从数据表中导出非文本内容
【发布时间】：2022-01-20 03:18:26
【问题描述】：

我正在尝试导出我的数据表的内容，但由于它不是文本，所以它没有被导出的列状态。

到目前为止我已经尝试过：

基本上我尝试过像这样使用 HTML5 导出按钮插件：

dom: 'Bfrtip',
buttons: [
  'copyHtml5',
  'excelHtml5',
  'csvHtml5',
  'pdfHtml5'
]

理想情况下，我希望在导出内容时，将绿色方块替换为文本“Active”，将红色方块替换为文本“Inactive”或其他字符串。

【问题讨论】：

标签： jquery datatables

【解决方案1】：

您应该参考数据表文档中的button.exportData()。

根据文档，可以通过自定义buttons属性来自定义数据，可以这样实现：

var DT1 = $('#example').DataTable({ 
    ...,   
    buttons: [
        {
            extend: 'excelHtml5',
            exportOptions: {
                format: {
                     body: function (data, rowIdx, colIndex, cellNode) {
                          const statusColumn = $(cellNode).find('div')
                          if (statusColumn.length > 0) {
                             return statusColumn.is('.status-active') ? 'Active' : 'Inactive'
                          }
                          return $(cellNode).text()
                     }
                }
            },
         },
     ]
})

以上代码是excelHtml5 的示例，您可以将其应用于按钮：copyHtml5、csvHtml5、pdfHtml5。

此link中的完整代码

更新：

您可以使用.text() 方法获取匹配元素集中每个元素的组合文本内容，包括它们的后代。赞这个$(cellNode).text()

【讨论】：

非常感谢您的回答，我将您的回答评为 50 声望。但是，如果某些列包含一个链接，例如：<td><a href="wwww.google.com">Tiger Nixon</a></td>，那么 html 部分也会被导出（在没有exportOptions 之前它可以正常工作。你知道如何解决它吗？
我更新我的答案来解决问题。你可以再检查一遍。

【解决方案2】：

请打开这个工作密码笔click here

$(document).ready(function() {
var buttonCommon = {
    exportOptions: {
        format: {
            body: function ( data, row, column, node ) {
                // Strip $ from salary column to make it numeric
              if(column === 2){
            
                var txt = $(node).html();
               
                if(txt.indexOf("status-active") > 0){
                     data = 'Active';
                }
              if(txt.indexOf("status-inactive") > 0){
                  data = 'In Active';
                }
                
                
              }
              
                return data;
              
            }
        }
    }
};

$('#example').DataTable( {
            columns: [
        { data: 'name' },
        { data: 'position' },
        { data: 'office' },
        { data: 'age' },
        { data: 'start_date' },
        { data: 'salary' }
    ],
    dom: 'Bfrtip',
    buttons: [
        
        $.extend( true, {}, buttonCommon, {
            extend: 'excelHtml5'
        } ),
        
    ]
} );

});

【讨论】：