jQuery 数据表导出到 Excel 自定义 - 使第一行加粗

Question

我有一个带有导出到 excel 按钮的数据表，我正在尝试自定义。 我环顾四周，看看如何定制，发现了一些，但仍然有问题。

当您导出到 excel 时，第一行似乎是页面标题。我正在尝试使这一行加粗；如果可能的话，将文本替换为页面标题以外的其他内容。

这是我看到并尝试修改以实现我需要的内容：

buttons: [
{
    extend: 'excelHtml5',
    customize: function ( xlsx ){
        var sheet = xlsx.xl.worksheets['sheet1.xml'];

        // jQuery selector to add a border
        //$('row c[r*="0"]', sheet).attr( 's', '25' );
        //$('row c[r^="C"]', sheet).attr( 's', '2' ); // third column is bold

        // Trying to make first row bold, this makes last row bold
        $('row c[r*="0"]', sheet).attr( 's', '2' );
        $(sheet.body)
            .css('font-size', '10pt');

        $(sheet.body).find('table')
            .addClass('compact')
            .css('font-size', 'inherit');
    },
    exportOptions: {
        columns: [0, 1, 2]
    },
},

此外，在应用格式时，我们似乎使用带有第一个参数“s”和数字的“attr”。我如何知道 25 表示边框，2 表示粗体？

我不明白如何操纵以下内容来影响样式更改：

    $('row c[r*="0"]', sheet).attr( 's', '2' );
    $('row c[r^="C"]', sheet).attr( 's', '25' ); 

Answer 1

假设您安装了按钮扩展，那么以下内容将在电子表格的第一行打印一个自定义标题，并将该标题加粗：

$(document).ready(function() {

  $('#myTable').DataTable( {
    dom: 'Bfrtip',
    buttons: [
        {
          extend: 'excel',
          customize: function ( xlsx ) {
            var sheet = xlsx.xl.worksheets['sheet1.xml'];
            $('c[r=A1] t', sheet).text( 'Custom Heading in First Row' );
            $('row:first c', sheet).attr( 's', '2' ); // first row is bold
          }
        }
    ]
  } );

});

例子：

关于您提到的预定义格式，您可以see a list of them here。

0 - Normal text
1 - White text
2 - Bold
3 - Italic
4 - Underline
etc...

操作导出数据的自定义命令也汇总在同一页面中。但我认为您需要参考SheetJS 了解更多详情。