Maison > Article > interface Web > Comment transférer du HTML vers Excel
Comment transférer du HTML vers Excel nécessite des exemples de code spécifiques
Introduction :
Dans le travail réel, nous devons parfois exporter des données de pages Web au format Excel. HTML est un langage de balisage Web courant, tandis qu'Excel est un tableur couramment utilisé. Les formats des deux sont différents, une conversion est donc nécessaire. Cet article expliquera comment utiliser JavaScript et des bibliothèques tierces pour réaliser la fonction de transfert de HTML vers des fichiers Excel et donnera des exemples de code spécifiques.
1. Utilisez JavaScript pour transférer du HTML vers Excel
<table id="myTable"> <tr> <th>姓名</th> <th>年龄</th> <th>性别</th> </tr> <tr> <td>张三</td> <td>25</td> <td>男</td> </tr> <tr> <td>李四</td> <td>30</td> <td>女</td> </tr> </table>
<button onclick="exportToExcel()">导出Excel</button>
Ensuite, nous devons ajouter un écouteur d'événement pour que le bouton déclenche la fonction d'exportation. Utilisez JavaScript pour écrire le code suivant :
function exportToExcel() { // 导出表格逻辑 }
(1) Créer un nouveau classeur Excel :
var wb = new ExcelJS.Workbook(); var ws = wb.addWorksheet('Sheet 1');
(2) Parcourez toutes les lignes et colonnes du tableau HTML et remplissez les données dans la feuille de calcul Excel Medium :
var rows = document.getElementById("myTable").rows; for (var i = 0; i < rows.length; i++) { var cells = rows[i].cells; for (var j = 0; j < cells.length; j++) { ws.getCell(i + 1, j + 1).value = cells[j].innerText; // 根据需要设置单元格样式 ws.getCell(i + 1, j + 1).alignment = { horizontal: 'left' }; } }
(3) Enregistrez le fichier Excel :
wb.xlsx.writeBuffer().then(function(buffer) { saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'data.xlsx'); });
Ajoutez ces codes à la fonction "exportToExcel", le code complet est le suivant :
function exportToExcel() { var wb = new ExcelJS.Workbook(); var ws = wb.addWorksheet('Sheet 1'); var rows = document.getElementById("myTable").rows; for (var i = 0; i < rows.length; i++) { var cells = rows[i].cells; for (var j = 0; j < cells.length; j++) { ws.getCell(i + 1, j + 1).value = cells[j].innerText; ws.getCell(i + 1, j + 1).alignment = { horizontal: 'left' }; } } wb.xlsx.writeBuffer().then(function(buffer) { saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'data.xlsx'); }); }
2. Utilisez une bibliothèque tierce pour transférer du HTML vers Excel
Dans en plus de JavaScript natif En plus du fonctionnement, nous pouvons également utiliser des bibliothèques tierces pour réaliser la fonction de transfert de HTML vers Excel, comme la bibliothèque « AlaSQL ». Voici le code spécifique pour utiliser la bibliothèque AlaSQL :
<script src="https://cdn.jsdelivr.net/npm/alasql"></script> <script src="https://cdn.jsdelivr.net/npm/exceljs"></script>
function exportToExcel() { var tableData = []; var rows = document.getElementById("myTable").rows; for (var i = 0; i < rows.length; i++) { var rowData = []; var cells = rows[i].cells; for (var j = 0; j < cells.length; j++) { rowData.push(cells[j].innerText); } tableData.push(rowData); } var opts = { sheetid: 'Sheet 1', headers: true, skipHeader: true }; var res = alasql('SELECT * INTO XLSX("data.xlsx",?) FROM ?', [opts, [tableData]]); }
<button onclick="exportToExcel()">导出Excel</button>
L'exemple de code complet du fichier HTML est le suivant :
HTML转存为Excel
姓名 | 年龄 | 性别 |
---|---|---|
张三 | 25 | 男 |
李四 | 30 | 女 |
Résumé :
Cet article explique comment utiliser JavaScript et des bibliothèques tierces pour transférer du HTML vers des fichiers Excel et donne des exemples de code spécifiques. Grâce à ces codes, nous pouvons facilement transférer les données de la page Web au format Excel pour répondre aux besoins d'exportation dans le travail réel. J'espère que cet article sera utile à tout le monde.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!