前端用html写excel文件直接打开
源码
<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40">
<head><meta charset="UTF-8"><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>Sheet1</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]-->
</head>
<body><table border="1"><tr><th>Header1</th><th>Header2</th><th>Header3</th></tr><tr><td>Data1</td><td style="width: 250px; height: 40px;"><img src="https://mmbiz.qpic.cn/sz_mmbiz_gif/BAhkmRPsSTRHJGSnTtkS8na0jjlkCIfbeZic9c56FXFZHvrPFKZE0zq4yKoZ14rLIuFmhmZst1Sm0l91P3IaTVA/640" width="80" height="40" /><img src="https://mmbiz.qpic.cn/sz_mmbiz_gif/BAhkmRPsSTRHJGSnTtkS8na0jjlkCIfb16LNfFOec8WPgFia7iclSicQ5XibsK8ohCDGnHvHDHJLfe3BhMNfpvK6Sw/640" width="80;" height="40" /><img src="https://mmbiz.qpic.cn/sz_mmbiz_gif/BAhkmRPsSTRHJGSnTtkS8na0jjlkCIfbXp1u0trKptUrj141tvFje1VO2FSwY47d2icJ4oKgZfnickFlLZfF0RYA/640" width="80" height="40" /></td><td>Data3</td></tr></table>
</body>
</html>
讲解
.html文件直接用excel能打开就因为：
<!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>Sheet1</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml>
<![endif]-->
其中<!--[if gte mso 9]>就是声明 Microsoft Office 的 Excel 软件可读的。金山的WPS有点不太友好，金山的WPS和Microsoft Office 的 Excel 有点差异
生成
前端想生成excel文件可以直接封装html组件了，改成 .xls 后缀名即可。可以不用js插件了
案例
<htmlxmlns:v="urn:schemas-microsoft-com:vml"xmlns:o="urn:schemas-microsoft-com:office:office"xmlns:x="urn:schemas-microsoft-com:office:excel"xmlns="http://www.w3.org/TR/REC-html40"
><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name> </x:Name><x:WorksheetOptions><x:Selected /></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--><style type="text/css">.td {width: 84px;}.gdtjContainer .tb tr {text-align: center;vertical-align: middle;}.gdtjContainer .tb th {border-left: 0.5pt solid #000;border-bottom: 0.5pt solid #000;text-align: center;font-weight: normal;font-size: 10pt;height: 30px;}.gdtjContainer .header th {font-size: 12pt;}.gdtjContainer .tb tr th.noleftborder {border-left: none;}.gdtjContainer .tb tr th.rightborder {border-right: 0.5pt solid #000;}</style></head><body><div class="gdtjContainer"><tableclass="tb"cellspacing="0"cellpadding="0"border="0"width="2184px"><colgroup><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /><col class="td" /></colgroup><tr style="height: 40px"><thstyle="font-size: 20pt; font-family: 宋体; border: none"colspan="26">2011年增城市单位土地使用权出让情况登记表（统计时间从2011-06-29至2011-06-30）</th></tr><tr><th colspan="23" style="border-left: none"> </th><thstyle="text-align: left; font-size: 12pt; border-left: none"colspan="3">单位：万元、平方米</th></tr><tr class="header"><th rowspan="2">合同编号</th><th colspan="2" rowspan="2">用地单位</th><th colspan="2" rowspan="2">土地座落</th><th rowspan="2">供地面积</th><th style="border-left: none"> </th><th> </th><th rowspan="2">用途</th><th colspan="3" rowspan="1">出让金</th><th rowspan="2">容积率</th><th rowspan="2">建筑密度</th><th rowspan="2">绿地率</th><th rowspan="2">规划建筑面积</th><th rowspan="2">出让方式</th><th rowspan="2">审批日期</th><th rowspan="2">合同签订日期</th><th rowspan="2">动工期限</th><th rowspan="2">竣工日期</th><th rowspan="2">批次情况</th><th rowspan="2">合同约定缴费期限</th><th rowspan="2">缴费情况</th><th rowspan="2">滞纳金</th><th rowspan="2" class="rightborder">备注</th></tr><tr style="height: 40px" class="header"><th>新增面积</th><th style="font-size: 10pt">保障性住房用地占用面积</th><th>应缴</th><th>已缴</th><th>未缴</th></tr><tr><th>440183-2011-</th><th colspan="2">45654</th><th colspan="2"> </th><th>1110000</th><th> </th><th> </th><th> </th><th>111</th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th>拍卖出让</th><th> </th><th>2011-06-29</th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th class="rightborder"> </th></tr><tr><th> </th><th colspan="2">合计</th><th colspan="2"> </th><th>1110000</th><th> </th><th> </th><th> </th><th>111</th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th> </th><th class="rightborder"> </th></tr></table></div></body>
</html>
相关文章：
前端用html写excel文件直接打开
源码 <html xmlns:o"urn:schemas-microsoft-com:office:office" xmlns:x"urn:schemas-microsoft-com:office:excel" xmlns"http://www.w3.org/TR/REC-html40"> <head><meta charset"UTF-8"><!--[if gte mso 9]&…...
FastText 和 Faiss 的初探了解
概览 大模型目前已经是如火如荼的程度，各个大厂都有推出面向大众的基础大模型，同时诸多行业也有在训练专有大模型，而大模型的发展由来却是经过多年从文本检索生成、深度学习、自然语言处理，在Transformer架构出来后，才…...
微服务保护学习笔记(五)Sentinel授权规则、获取origin、自定义异常结果、规则持久化
文章目录 前言4 授权规则4.1 基本原理4.2 获取origin4.3 配置授权规则 5 自定义异常结果6 规则持久化 前言 微服务保护学习笔记(一)雪崩问题及解决方案、Sentinel介绍与安装 微服务保护学习笔记(二)簇点链路、流控操作、流控模式(关联、链路) 微服务保护学习笔记(三)流控效果(…...
YOLOv8目标检测模型——遥感小目标检测经验分享
小目标检测——YOLOV8 一、引言 背景介绍 （1）目标检测的重要性 目标检测在许多领域都具有极其重要的作用。在自动驾驶中，目标检测能够识别道路上的障碍物和行人，确保行车安全。在视频监控中，目标检测能够实时发现异…...
构建响应式 Web 应用：Vue.js 基础指南
构建响应式 Web 应用：Vue.js 基础指南 一 . Vue 的介绍1.1 介绍1.2 好处1.3 特点 二 . Vue 的快速入门2.1 案例 1 : 快速搭建 Vue 的运行环境 , 在 div 视图中获取 Vue 中的数据2.2 案例 2 : 点击按钮执行 vue 中的函数输出 vue 中 data 的数据2.3 小结 三 . Vue 常…...
计算机毕业设计选题推荐-在线投票系统-Java/Python项目实战
✨作者主页：IT研究室✨ 个人简介：曾从事计算机专业培训教学，擅长Java、Python、微信小程序、Golang、安卓Android等项目实战。接项目定制开发、代码讲解、答辩教学、文档编写、降重等。 ☑文末获取源码☑ 精彩专栏推荐⬇⬇⬇ Java项目 Python…...
【C/C++】程序的构建（编译）过程概述
🦄个人主页:小米里的大麦-CSDN博客 🎏所属专栏:C_小米里的大麦的博客-CSDN博客 🎁代码托管:C: 探索C编程精髓，打造高效代码仓库 (gitee.com) ⚙️操作环境:Visual Studio 2022 目录 一、前言 二、预处理（Preprocessi…...
ElasticSearch-2-核心语法集群高可用实战-Week2
ES批量操作 1.批量获取文档数据 这里多个文档是指，批量操作多个文档，搜索查询文档将在之后的章节讲解 批量获取文档数据是通过_mget的API来实现的 (1)在URL中不指定index和type 请求方式：GET 请求地址：_mget 功能说明 &#…...
STM的CAN通信学习
显性电平：0 隐性电平：1 一、帧结构 1.帧类型 1）数据帧：发送设备主动发送数据（广播式） 2）请求帧：接收设备主动请求数据（请求式） 2.帧结构 1ÿ…...
【高等数学学习记录】函数
【高等数学&学习记录】函数 从事测绘工作多年，深刻感受到基础知识的重要及自身在这方面的短板。 为此，打算重温测绘工作所需基础知识。练好基本功，为测绘工作赋能。 1 知识点 1.1 函数 设数集 D ⊂ R D\subset R D⊂R，称映射…...
【springboot过ingress后无法获取X-Forwarded-For头信息】
springboot过ingress后无法获取X-Forwarded-For头信息 一、现象结论修改步骤ingressspringboot 排查流程本文参考 一、现象 项目使用spring boot 2.7.18，有个新需求是校验X-Forwarded-For头的所有来源ip合法性，线上环境出现取不到X-Forwarded-For头的问…...
表格标记＜table＞
一.表格标记、 1table：表格标记 2.caption:表单标题标记 3.tr:表格行标记 4.td:表格中数据单元格标记 5.th:标题单元格 table标记是表格中最外层标记，tr表示表格中的行标记，一对<tr>表示表格中的一行，在<tr>中可…...
Rust练手项目，写个有趣的小工具定时从一言网获取一段有趣的话并推送通知
Rust练手项目，写个有趣的小工具 代码 继续练习Rust, 写个小工具定时从一言网获取一段有趣的话并提示，如下 练习以下Rust点 并发编程 Mutex, Arc指针使用HTTP请求Windows Gui 代码 Cargo.toml [package] name "funny_word" edition "20…...
【隐私计算】Paillier半同态加密算法
一、何为同态加密（HE）？ HE是一种特殊的加密方法，它允许直接对加密数据执行计算，如加法和乘法，而计算过程不会泄露原文的任何信息。计算的结果仍然是加密的，拥有密钥的用户对处理过的密文数据进…...
判断数字的奇偶[中秋快乐~]
题目描述 给定一个整数 n,编写程序判断数字 n 是奇数还是偶数，是奇数则输出 “odd”，偶数则输出 “even”。 输入格式 一行，一个整数 n。 输出格式 一行，如果 n 是奇数则输出 “odd”; 如果 nn 是偶数则输出 “even”。 样例…...
文件操作及重定向详解
1、linux下一切皆文件： 在linux中，一切皆文件是一个重要的概念，用于描述linux操作系统中所有资源和设备都以文件的形式进行访问和处理。 这个概念可以理解为，无论是硬盘上的文件、网卡、设备、进程等，都被抽象为文件的形式存在。在linux系统中，通…...
鸿蒙next json解析 ArkUI 带你玩转 arkts json解析
前言导读 相信很多同学再开发过程中都会遇到json解析的处理，不管是跟服务端交互 或者是读取本地的json 都会遇到json解析 那么正好今天有空正好讲一下鸿蒙next里面的json解析 JSON解析与生成 本模块提供了将JSON文本转换为JSON对应对象或值，以及将对象…...
东土科技加码芯片业务投资，携手神经元共建新型工业生态
为抢抓国产化芯片发展的重大机遇，东土科技决定进一步加大对神经元信息技术（成都）有限公司的投资。这一战略布局有利于东土科技鸿道Intewell工业操作系统与神经元公司芯片的深度协同，推动实现“信息技术、网络技术、控制技术、数字…...
指纹与指甲检测系统源码分享
指纹与指甲检测检测系统源码分享 [一条龙教学YOLOV8标注好的数据集一键训练_70全套改进创新点发刊_Web前端展示] 1.研究背景与意义 项目参考AAAI Association for the Advancement of Artificial Intelligence 项目来源AACV Association for the Advancement of Computer V…...
C++3D迷宫
目录 开头程序程序的流程图程序游玩的效果下一篇博客要说的东西 开头 大家好，我叫这是我58。 程序 #include <iostream> using namespace std; void printmaze(char strmaze[5][5][5]) {cout << "-----" << endl;int i 0;int ia 0…...
golang循环变量捕获问题
在 Go 语言中，当在循环中启动协程（goroutine）时，如果在协程闭包中直接引用循环变量，可能会遇到一个常见的陷阱 - 循环变量捕获问题。让我详细解释一下： 问题背景 看这个代码片段： fo…...
JavaScript 中的 ES|QL：利用 Apache Arrow 工具
作者：来自 Elastic Jeffrey Rengifo 学习如何将 ES|QL 与 JavaScript 的 Apache Arrow 客户端工具一起使用。 想获得 Elastic 认证吗？了解下一期 Elasticsearch Engineer 培训的时间吧！ Elasticsearch 拥有众多新功能，助你为自己…...
《从零掌握MIPI CSI-2: 协议精解与FPGA摄像头开发实战》-- CSI-2 协议详细解析 (一）
CSI-2 协议详细解析 (一） 1. CSI-2层定义（CSI-2 Layer Definitions） 分层结构 ：CSI-2协议分为6层： 物理层（PHY Layer） ： 定义电气特性、时钟机制和传输介质（导线&#…...
ip子接口配置及删除
配置永久生效的子接口，2个IP 都可以登录你这一台服务器。重启不失效。 永久的 [应用] vi /etc/sysconfig/network-scripts/ifcfg-eth0修改文件内内容 TYPE"Ethernet" BOOTPROTO"none" NAME"eth0" DEVICE"eth0" ONBOOT&q…...
JVM 内存结构 详解
内存结构 运行时数据区： Java虚拟机在运行Java程序过程中管理的内存区域。 程序计数器： 线程私有，程序控制流的指示器，分支、循环、跳转、异常处理、线程恢复等基础功能都依赖这个计数器完成。 每个线程都有一个程序计数…...
免费PDF转图片工具
免费PDF转图片工具 一款简单易用的PDF转图片工具，可以将PDF文件快速转换为高质量PNG图片。无需安装复杂的软件，也不需要在线上传文件，保护您的隐私。 工具截图 主要特点 🚀 快速转换：本地转换，无需等待上…...
云原生安全实战：API网关Kong的鉴权与限流详解
🔥「炎码工坊」技术弹药已装填！ 点击关注 → 解锁工业级干货【工具实测|项目避坑|源码燃烧指南】 一、基础概念 1. API网关（API Gateway） API网关是微服务架构中的核心组件，负责统一管理所有API的流量入口。它像一座…...
Selenium常用函数介绍
目录 一，元素定位 1.1 cssSeector 1.2 xpath 二，操作测试对象 三，窗口 3.1 案例 3.2 窗口切换 3.3 窗口大小 3.4 屏幕截图 3.5 关闭窗口 四，弹窗 五，等待 六，导航 七，文件上传 …...
怎么让Comfyui导出的图像不包含工作流信息，
为了数据安全，让Comfyui导出的图像不包含工作流信息，导出的图像就不会拖到comfyui中加载出来工作流。 ComfyUI的目录下node.py 直接移除 pnginfo（推荐） 在 save_images 方法中，删除或注释掉所有与 metadata …...
毫米波雷达基础理论（3D+4D）
3D、4D毫米波雷达基础知识及厂商选型 PreView : https://mp.weixin.qq.com/s/bQkju4r6med7I3TBGJI_bQ 1. FMCW毫米波雷达基础知识 主要参考博文： 一文入门汽车毫米波雷达基本原理 ：https://mp.weixin.qq.com/s/_EN7A5lKcz2Eh8dLnjE19w 毫米波雷达基础…...