新闻详情

新闻详情

首页 / 资讯中心 / 详情

JS 导出 Excel 文件、SheetJS(xlsx)前端导出 Excel

发布时间:2026/9/1 14:42:08来源:尧图网络
JS 导出 Excel 文件、SheetJS(xlsx)前端导出 Excel
一、JS 导出 Excel 文件!DOCTYPEhtmlhtmllangenheadmetacharsetUTF-8/metahttp-equivX-UA-CompatiblecontentIEedge/metanameviewportcontentwidthdevice-width, initial-scale1.0/titleJS 导出 Excel 文件/titlestyle*{margin:0;padding:0;box-sizing:border-box;}.app{margin:20px 0 0 20px;}table{border:0.5px solid black;}td, th{width:100px;height:30px;line-height:30px;text-align:center;border:0.5px solid black;}/style/headbodydivclassapptableiddatacellspacing0trth序号/thth姓名/thth年龄/th/trtrtd1/tdtd张三/tdtd25/td/trtrtd2/tdtd李四/tdtd30/td/tr/table!-- 必须是 a 标签如果是 button 标签没有 href 属性如果无法设置 href 属性就不能生成 Excel文件 --aidtoExcelhref导出 Excel 文件/a/divscriptvartoExceldocument.getElementById(toExcel);toExcel.onclickfunction(event){// 获得表格的 HTML 标签和文本数据varmyHtmlhtml head meta charsetUTF-8 /head body${document.getElementById(data).outerHTML}/body /html;// 创建一个 Blob 对象// 第一个参数是文件的数据// 第二个参数是文件类型属性对象varmyBlobnewBlob([myHtml],{type:application/vnd.ms-excel,});varmyTargetevent.target;// 利用 URL.createObjectURL 方法为元素 myTarget 生成 blobURLmyTarget.hrefURL.createObjectURL(myBlob);// 设置文件名myTarget.download人员表;};/script/body/html二、SheetJSxlsx前端导出 Excel安装依赖pnpmaddxlsx核心 API 调用链路import*asXLSXfromxlsx;// 1、准备数据数组对象constrows[{姓名:张三,年龄:28,部门:技术部},{姓名:李四,年龄:32,部门:产品部},];// 2、数组对象 → 工作表WorksheetconstworksheetXLSX.utils.json_to_sheet(rows);// 3、新建工作簿WorkbookconstworkbookXLSX.utils.book_new();// 4、将工作表追加到工作簿并指定工作表名称XLSX.utils.book_append_sheet(workbook,worksheet,员工信息);// 5、指定工作簿名称吗触发浏览器下载文件XLSX.writeFile(workbook,导出文件_${Date.now()}.xlsx);Excel 工作簿就是 Excel 文件本身
网站建设高端定制企业官网
RELATED

相关资讯

更多精彩内容,欢迎继续阅读

较早相关资讯

最新相关资讯

Linux更新后服务为何不中断?如何修复残留旧进程 2026/9/1 19:34:31

Linux更新后服务为何不中断?如何修复残留旧进程

在实际 Linux 服务器运维中,有一种现象经常让新手困惑:执行apt upgrade或dnf upgrade更新系统时,正在运行的 Web 服务、数据库进程并没有因为文件被替换而立即停止,业务请求还能继续走通。于是有人开玩笑说,“我竟然修…

阅读更多 →
apt/dpkg锁机制深度解析:Linux更新时为何还能继续使用? 2026/9/1 19:34:31

apt/dpkg锁机制深度解析:Linux更新时为何还能继续使用?

最近在排查服务器更新问题时,遇到一个很有意思的现象:Linux 系统明明在apt upgrade,操作界面却一点也没有“被锁定”的感觉,用户还能正常登录、执行命令,甚至可以再次调用 apt。第一反应是包管理器出 bug 了&#xff0…

阅读更多 →
mpx是什么?一文搞懂Premiere GPU加速与宣传片渲染优化 2026/9/1 19:34:31

mpx是什么?一文搞懂Premiere GPU加速与宣传片渲染优化

做宣传片最让人头疼的往往不是创意,而是渲染和预览:一条 3 分钟企业宣传片,导出时卡在进度条半小时;预览窗口一拖动就掉帧;素材一变多,软件直接灰屏。很多做宣传片的朋友会听到一个词:mpx。它到…

阅读更多 →
Mpx跨端小程序框架技术拆解:原生增强与多端编译实践 2026/9/1 19:34:31

Mpx跨端小程序框架技术拆解:原生增强与多端编译实践

最近要做 Mpx 主题分享或者准备 Mpx 宣传内容的同学应该不少。宣传片只是入口,真正有价值的是把 Mpx 这个框架讲清楚:它到底解决什么问题、上手门槛多高、和原生小程序开发有什么不一样、团队切过来要改多少东西。这篇文章直接按技术拆解的方式来写&…

阅读更多 →
信号与系统考研波形变换:关键点映射法三步画对x(-2t+1) 2026/9/1 19:34:31

信号与系统考研波形变换:关键点映射法三步画对x(-2t+1)

信号与系统考研里有一类题,看着基础,丢分率却高得离谱:给你一个原始波形 (x(t)),让你画出 (x(-2t1)) 这种综合变换后的波形。很多同学不是不懂“尺度、时移、反转”三个概念,而是顺序一复杂就画错。有些时候是先平移还…

阅读更多 →
传说对决8月13日不停机改版:苏离重做与英雄调整深度解析 2026/9/1 19:31:30

传说对决8月13日不停机改版:苏离重做与英雄调整深度解析

《傳說對決》8月13日不停机改版已经上线,这次改版最受关注的无疑是苏离重做,同时爱丽丝、刀锋宝贝、莫托斯被削弱,夜姬、克里希获得增强,萨尼和雾己延续了之前的加强趋势。对于经常打排位的玩家来说,版本更新之后不能只…

阅读更多 →

今日资讯

本周资讯

本月资讯

看完文章仍有疑问?

联系尧图顾问,获取一对一建站咨询

立即免费咨询 📞 400-888-8888
📞