JSFiddle - React, Tailwind, and code Playground

by Juan Muñoz

HTML

<input type='button' id='btnExcelFinal' value='ExportarExcel' />
<div id='cargaPen'>

<table border="1"><tbody><tr><td>Cuenta:      </td><td> 1005001 </td><td>Clientes</td></tr></tbody></table><table border="1" class="tblWidth"><tbody><tr><th class="col1">Rut       </th><th class="col2">Nombre    </th><th class="col3">Nro Doc.  </th><th class="col4">Fecha E.  </th><th class="col5">Fecha V.  </th><th class="col6">Detalle   </th><th class="col7">Debe      </th><th class="col8">Haber     </th><th class="col9">Saldo     </th></tr><tr><td>7602782-K               </td><td colspan="5">ADRIANA VILLALOBOSALMUNA</td><td class="right">0                 </td><td class="right">395.675                 </td><td class="right">395.675</td><td class="rojo">CR</td></tr><tr class="tbodyPrin"><td class="col1 sinborde"></td><td class="col2 sinborde">FAV    </td><td class="col3 sinborde">1148    </td><td class="col4 sinborde">2014-01-31      </td><td class="col5 sinborde">2014-01-31      </td><td class="col6 sinborde">CAJA/201401/CLIENTES ENERO/1</td><td class="col7 sinborde right">0         </td><td class="col8 sinborde right">395.675          </td><td class="col9 sinborde"></td></tr><tr></tr><tr><td>78027440-9               </td><td colspan="5">AGRCIOLA CAMPO DE MAYO LTDA.</td><td class="right">0                 </td><td class="right">68.425                 </td><td class="right">68.425</td><td class="rojo">CR</td></tr><tr class="tbodyPrin"><td class="col1 sinborde"></td><td class="col2 sinborde">FAV    </td><td class="col3 sinborde">1110    </td><td class="col4 sinborde">2014-01-31      </td><td class="col5 sinborde">2014-01-31      </td><td class="col6 sinborde">CAJA/201401/CLIENTES ENERO/1</td><td class="col7 sinborde right">0         </td><td class="col8 sinborde right">68.425          </td><td class="col9 sinborde"></td></tr><tr></tr><tr><td>76177136-1               </td><td colspan="5">AGRIC ARROYO GRANDE LTDA.</td><td class="right">0                 </td><td...

JavaScript

$(document).ready(function() {
$("#btnExcelFinal").click(function(e) {

    var a = document.createElement('a');
    //getting data from our div that contains the HTML table
    var data_type = 'data:application/vnd.ms-excel';
    var table_div = document.getElementById('cargaPen');
    var table_html = table_div.outerHTML.replace(/ /g, '%20');
    a.href = data_type + ', ' + table_html;
    //setting the file name
    a.download = 'download.xls';
    //triggering the function
    a.click();
    //just in case, prevent default behaviour
    e.preventDefault();
});
});