js 导出 excel 文件

今天来整理一下js导出excel文件很简单引入一点js 就可以了。原理不讲了,直接上代码

一、引入 js

下载地址:http://download.csdn.net/detail/webxiaoma/9858826

二、html 书写格式:

HTML:

<table id="targetTable">
   <tr>
     <td>111111111111</td>
     <td>222222222222</td>
   <tr>
</table>
<button type="button" onclick="javascript:method1('targetTable')">导出EXCEL</button>

//targetTable 为 table id,可以修改

点击 button 就可以将表格导出为excel了。

在 JavaScript 中,你可以使用以下方法将数据导出Excel 文件: 1. 使用 HTML5 的 Blob 对象和 URL.createObjectURL 方法: ```javascript function exportToExcel(data, filename) { const csvData = convertToCSV(data); const blob = new Blob([csvData], { type: 'text/csv;charset=utf-8;' }); const url = URL.createObjectURL(blob); const link = document.createElement('a'); link.href = url; link.setAttribute('download', filename + '.csv'); link.style.visibility = 'hidden'; document.body.appendChild(link); link.click(); document.body.removeChild(link); } function convertToCSV(data) { const separator = ','; const keys = Object.keys(data[0]); const header = keys.join(separator); const rows = data.map(row => { return keys.map(key => { return row[key]; }).join(separator); }); return header + '\n' + rows.join('\n'); } // 使用示例 const data = [ { name: 'John', age: 30, city: 'New York' }, { name: 'Jane', age: 25, city: 'San Francisco' }, { name: 'Bob', age: 35, city: 'Chicago' } ]; exportToExcel(data, 'users'); ``` 2. 使用第三方库,如 `xlsx`: ```javascript // 安装 xlsx 库 // npm install xlsx const XLSX = require('xlsx'); function exportToExcel(data, filename) { const wb = XLSX.utils.book_new(); const ws = XLSX.utils.json_to_sheet(data); XLSX.utils.book_append_sheet(wb, ws, 'Sheet1'); XLSX.writeFile(wb, filename + '.xlsx'); } // 使用示例 const data = [ { name: 'John', age: 30, city: 'New York' }, { name: 'Jane', age: 25, city: 'San Francisco' }, { name: 'Bob', age: 35, city: 'Chicago' } ]; exportToExcel(data, 'users'); ``` 这些方法可以将数据导出为 CSV 或 XLSX 格式的 Excel 文件。你可以根据自己的需求选择合适的方法。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值