簡介
在現代網頁應用開發中，經常需要將HTML表格數據匯出為Excel格式，以便用戶進行數據處理和分析。這篇教學將詳細介紹如何從HTML轉換為Excel，並將相關技術和步驟分解為易於理解的部分。
準備工作
在開始之前，請確認您已經設置好基本的開發環境並安裝了必要的工具。例如，您將需要一個文本編輯器（如VS Code），並且您的系統上應該安裝了Node.js和npm。
設置專案
首先，創建一個新的項目目錄並初始化npm：
mkdir html-to-excel
cd html-to-excel
npm init -y安裝所需的庫
我們將使用一個名為“xlsx”的庫來處理Excel文件。運行以下命令來安裝它：
npm install xlsx編寫HTML文件
創建一個新的HTML文件，命名為index.html，並添加以下內容：
<!DOCTYPE html>
<html lang="zh-Hant">
<head>
<meta charset="UTF-8">
<title>HTML to Excel 教學</title>
</head>
<body>
<table id="myTable">
<thead>
<tr>
<th>姓名</th>
<th>年齡</th>
<th>城市</th>
</tr>
</thead>
<tbody>
<tr>
<td>張三</td>
<td>28</td>
<td>臺北</td>
</tr>
<tr>
<td>李四</td>
<td>34</td>
<td>高雄</td>
</tr>
</tbody>
</table>
<button onclick="exportToExcel()">匯出為Excel</button>
<script src="export.js"></script>
</body>
</html>編寫JavaScript文件
創建一個名為export.js的JavaScript文件，並添加以下代碼以實現Excel的匯出功能：
const XLSX = require('xlsx');
function exportToExcel() {
// 取得表格的元素
const table = document.getElementById('myTable');
// 讀取表格數據
const workbook = XLSX.utils.table_to_book(table, {sheet: 'Sheet1'});
// 將數據寫入Excel文件
XLSX.writeFile(workbook, '數據表.xlsx');
}運行項目
設置一個簡單的HTTP服務器以運行您的HTML文件，可以使用lite-server或其他類似工具。在項目目錄中安裝lite-server：
npm install lite-server --save-dev在package.json文件中添加一個啟動腳本：
"scripts": {
"start": "lite-server"
}現在，運行以下命令以啟動服務器：
npm start開啟瀏覽器，訪問http://localhost:3000，您將看到一個包含表格的頁面。點擊“匯出為Excel”按鈕，系統將自動下載Excel文件。
總結
通過本教學，您已經學會了如何將HTML表格數據匯出為Excel文件。這一過程涉及設置專案、編寫HTML和JavaScript代碼，以及使用“xlsx”庫來實現Excel的匯出功能。希望這篇教學對您有所幫助，讓您更好地掌握數據處理的技能。
