JSFiddle - React, Tailwind, and code Playground

by Rapha Souza

HTML

<link rel="stylesheet" href="https://www.jqueryscript.net/demo/Exporting-Html-Tables-To-CSV-XLS-XLSX-Text-TableExport/dist/css/tableexport.css">
<script src="https://code.jquery.com/jquery-3.4.1.slim.js"></script>
<script src="https://www.jqueryscript.net/demo/Exporting-Html-Tables-To-CSV-XLS-XLSX-Text-TableExport/FileSaver.min.js"></script>
<script src="https://www.jqueryscript.net/demo/Exporting-Html-Tables-To-CSV-XLS-XLSX-Text-TableExport/dist/js/tableexport.js"></script>
<script src="https://www.jqueryscript.net/demo/Exporting-Html-Tables-To-CSV-XLS-XLSX-Text-TableExport/Blob.min.js"></script>
<script src="https://www.jqueryscript.net/demo/Exporting-Html-Tables-To-CSV-XLS-XLSX-Text-TableExport/xls.core.min.js"></script>
<table class="table table-striped table-bordered" data-name="cool-table">
                                <thead>
                                <tr>
                                    <th>Rank</th>
                                    <th>Country</th>
                                    <th>Population</th>
                                    <th>% of world population</th>
                                    <th>Date</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr>
                                    <td>1</td>
                                    <td>China</td>
                                    <td>1,370,570,000</td>
                                    <td>18.9%</td>
                                    <td>June 24, 2015</td>
                                </tr>
                                <tr>
                                    <td>2</td>
                                    <td>India</td>
                                    <td>1,273,140,000</td>
                                    <td>17.6%</td>
                                    <td>June 24, 2015</td>
                                </tr>
                               ...

JavaScript

$(".table").tableExport({

  // Displays table headers (th or td elements) in the <thead>
  headers: true,

  // Displays table footers (th or td elements) in the <tfoot>    
  footers: true,

  // Filetype(s) for the export
  formats: ["xls", "txt"],

  // Filename for the downloaded file
  fileName: "arquivo",

  // Style buttons using bootstrap framework  
  bootstrap: false,

  // Automatically generates the built-in export buttons for each of the specified formats   
  exportButtons: true,

  // Position of the caption element relative to table
  position: "bottom",

  // (Number, Number[]), Row indices to exclude from the exported file(s)
  ignoreRows: null,

  // (Number, Number[]), column indices to exclude from the exported file(s)              
  ignoreCols: null,

  // Removes all leading/trailing newlines, spaces, and tabs from cell text in the exported file(s)     
  trimWhitespace: false,

  // (Boolean), set direction of the worksheet to right-to-left (default: false)
  RTL: false,

  // (id, String), sheet name for the exported spreadsheet, (default: 'id') 
  sheetname: "id"



});