Comment exporter un tableau HTML vers Excel à l'aide de JavaScript

Comment Exporter Un Tableau Html Vers Excel A L Aide De Javascript



Parfois, les développeurs doivent exporter les tableaux HTML vers un fichier Excel qui les aide à voir les statistiques/données du site Web dans un format de fichier pour les rapports du site Web et à utiliser ce fichier même hors ligne. En JavaScript, plusieurs bibliothèques sont disponibles pour plusieurs tâches. De même, un tableau HTML peut être facilement converti au format de feuille Excel à l'aide d'une bibliothèque JavaScript.

Ce didacticiel définira le processus d'exportation des données du tableau HTML vers Excel à l'aide de JavaScript.

Comment exporter un tableau HTML vers Excel à l'aide de JavaScript ?

Pour exporter un tableau d'un HTML vers une feuille de calcul Excel, utilisez la bibliothèque JavaScript ' SheetJS ”. Il fournit des fonctionnalités pour lire, modifier et exporter des feuilles de calcul tout en travaillant dans des navigateurs Web.







Ajoutez la source ci-dessous du ' SheetJS ” Bibliothèque JavaScript dans balise du projet :



< type de scénario = 'texte/javascript' src = 'https://unpkg.com/ [e-mail protégé] /dist/xlsx.full.min.js' > scénario >

Essayons un exemple pour exporter un tableau HTML avec des données dans une feuille de calcul.



Exemple
Tout d'abord, créez une table dans un fichier HTML, en utilisant

étiquette:





< identifiant de table = 'tblVersExcl' frontière = 'deux' >
< tête >
< e > Identifiant e >
< e > Nom e >
< e > Noter e >
< e > Rouleau# e >
< e > Âge e >
tête >
< le corps >
< tr >
< td > 1 td >
< td > John td >
< td > 8 td >
< td > 118 td >
< td > 13 td >
tr >
< tr >
< td > deux td >
< td > Rohnda td >
< td > sept td >
< td > 153 td >
< td > 12 td >
tr >
< tr >
< td > 3 td >
< td > Étienne td >
< td > 9 td >
< td > 138 td >
< td > 14 td >
tr >
le corps >
table >

Ensuite, créez un bouton en attachant un ' sur clic ' événement qui déclenchera le ' htmlTableVersExcel() ” pour exporter le tableau dans une feuille Excel :

< identifiant du bouton = 'bouton' sur clic = 'htmlTableVersExcel('xlsx')' > Exporter le tableau HTML vers EXCEL bouton >

La sortie affiche le tableau avec les données :



Le code JavaScript pour exporter la table de données dans une feuille est le suivant :

fonction htmlTableVersExcel ( taper ) {
a été Les données = document. getElementById ( 'tblToExcl' ) ;
a été fichier Excel = XLSX. utilitaires . table_to_book ( Les données , { feuille : 'feuille1' } ) ;
XLSX. écrivez ( fichier Excel , { type de livre : taper , livreSST : vrai , taper : 'base64' } ) ;
XLSX. écrireFichier ( fichier Excel , 'FichierExporté:HTMLTableVersExcel' + taper ) ;
}

Le code JavaScript ci-dessus suit les étapes indiquées pour exporter le tableau vers la feuille Excel :