当前位置: 首页 > news >正文

前端用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 的初探了解

概览 大模型目前已经是如火如荼的程度&#xff0c;各个大厂都有推出面向大众的基础大模型&#xff0c;同时诸多行业也有在训练专有大模型&#xff0c;而大模型的发展由来却是经过多年从文本检索生成、深度学习、自然语言处理&#xff0c;在Transformer架构出来后&#xff0c;才…...

微服务保护学习笔记(五)Sentinel授权规则、获取origin、自定义异常结果、规则持久化

文章目录 前言4 授权规则4.1 基本原理4.2 获取origin4.3 配置授权规则 5 自定义异常结果6 规则持久化 前言 微服务保护学习笔记(一)雪崩问题及解决方案、Sentinel介绍与安装 微服务保护学习笔记(二)簇点链路、流控操作、流控模式(关联、链路) 微服务保护学习笔记(三)流控效果(…...

YOLOv8目标检测模型——遥感小目标检测经验分享

小目标检测——YOLOV8 一、引言 背景介绍 &#xff08;1&#xff09;目标检测的重要性 目标检测在许多领域都具有极其重要的作用。在自动驾驶中&#xff0c;目标检测能够识别道路上的障碍物和行人&#xff0c;确保行车安全。在视频监控中&#xff0c;目标检测能够实时发现异…...

构建响应式 Web 应用:Vue.js 基础指南

构建响应式 Web 应用&#xff1a;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项目实战

✨作者主页&#xff1a;IT研究室✨ 个人简介&#xff1a;曾从事计算机专业培训教学&#xff0c;擅长Java、Python、微信小程序、Golang、安卓Android等项目实战。接项目定制开发、代码讲解、答辩教学、文档编写、降重等。 ☑文末获取源码☑ 精彩专栏推荐⬇⬇⬇ Java项目 Python…...

【C/C++】程序的构建(编译)过程概述

&#x1f984;个人主页:小米里的大麦-CSDN博客 &#x1f38f;所属专栏:C_小米里的大麦的博客-CSDN博客 &#x1f381;代码托管:C: 探索C编程精髓&#xff0c;打造高效代码仓库 (gitee.com) ⚙️操作环境:Visual Studio 2022 目录 一、前言 二、预处理&#xff08;Preprocessi…...

ElasticSearch-2-核心语法集群高可用实战-Week2

ES批量操作 1.批量获取文档数据 这里多个文档是指&#xff0c;批量操作多个文档&#xff0c;搜索查询文档将在之后的章节讲解 批量获取文档数据是通过_mget的API来实现的 (1)在URL中不指定index和type 请求方式&#xff1a;GET 请求地址&#xff1a;_mget 功能说明 &#…...

STM的CAN通信学习

显性电平&#xff1a;0 隐性电平&#xff1a;1 一、帧结构 1.帧类型 1&#xff09;数据帧&#xff1a;发送设备主动发送数据&#xff08;广播式&#xff09; 2&#xff09;请求帧&#xff1a;接收设备主动请求数据&#xff08;请求式&#xff09; 2.帧结构 1&#xff…...

【高等数学学习记录】函数

【高等数学&学习记录】函数 从事测绘工作多年&#xff0c;深刻感受到基础知识的重要及自身在这方面的短板。 为此&#xff0c;打算重温测绘工作所需基础知识。练好基本功&#xff0c;为测绘工作赋能。 1 知识点 1.1 函数 设数集 D ⊂ R D\subset R D⊂R&#xff0c;称映射…...

【springboot过ingress后无法获取X-Forwarded-For头信息】

springboot过ingress后无法获取X-Forwarded-For头信息 一、现象结论修改步骤ingressspringboot 排查流程本文参考 一、现象 项目使用spring boot 2.7.18&#xff0c;有个新需求是校验X-Forwarded-For头的所有来源ip合法性&#xff0c;线上环境出现取不到X-Forwarded-For头的问…...

表格标记<table>

一.表格标记、 1table&#xff1a;表格标记 2.caption:表单标题标记 3.tr:表格行标记 4.td:表格中数据单元格标记 5.th:标题单元格 table标记是表格中最外层标记&#xff0c;tr表示表格中的行标记&#xff0c;一对<tr>表示表格中的一行&#xff0c;在<tr>中可…...

Rust练手项目,写个有趣的小工具定时从一言网获取一段有趣的话并推送通知

Rust练手项目&#xff0c;写个有趣的小工具 代码 继续练习Rust, 写个小工具定时从一言网获取一段有趣的话并提示&#xff0c;如下 练习以下Rust点 并发编程 Mutex, Arc指针使用HTTP请求Windows Gui 代码 Cargo.toml [package] name "funny_word" edition "20…...

【隐私计算】Paillier半同态加密算法

一、何为同态加密&#xff08;HE&#xff09;&#xff1f; HE是一种特殊的加密方法&#xff0c;它允许直接对加密数据执行计算&#xff0c;如加法和乘法&#xff0c;而计算过程不会泄露原文的任何信息。计算的结果仍然是加密的&#xff0c;拥有密钥的用户对处理过的密文数据进…...

判断数字的奇偶[中秋快乐~]

题目描述 给定一个整数 n,编写程序判断数字 n 是奇数还是偶数&#xff0c;是奇数则输出 “odd”&#xff0c;偶数则输出 “even”。 输入格式 一行&#xff0c;一个整数 n。 输出格式 一行&#xff0c;如果 n 是奇数则输出 “odd”; 如果 nn 是偶数则输出 “even”。 样例…...

文件操作及重定向详解

1、linux下一切皆文件: 在linux中,一切皆文件是一个重要的概念,用于描述linux操作系统中所有资源和设备都以文件的形式进行访问和处理。 这个概念可以理解为,无论是硬盘上的文件、网卡、设备、进程等,都被抽象为文件的形式存在。在linux系统中,通…...

鸿蒙next json解析 ArkUI 带你玩转 arkts json解析

前言导读 相信很多同学再开发过程中都会遇到json解析的处理&#xff0c;不管是跟服务端交互 或者是读取本地的json 都会遇到json解析 那么正好今天有空正好讲一下鸿蒙next里面的json解析 JSON解析与生成 本模块提供了将JSON文本转换为JSON对应对象或值&#xff0c;以及将对象…...

东土科技加码芯片业务投资,携手神经元共建新型工业生态

为抢抓国产化芯片发展的重大机遇&#xff0c;东土科技决定进一步加大对神经元信息技术&#xff08;成都&#xff09;有限公司的投资。这一战略布局有利于东土科技鸿道Intewell工业操作系统与神经元公司芯片的深度协同&#xff0c;推动实现“信息技术、网络技术、控制技术、数字…...

指纹与指甲检测系统源码分享

指纹与指甲检测检测系统源码分享 [一条龙教学YOLOV8标注好的数据集一键训练_70全套改进创新点发刊_Web前端展示] 1.研究背景与意义 项目参考AAAI Association for the Advancement of Artificial Intelligence 项目来源AACV Association for the Advancement of Computer V…...

C++3D迷宫

目录 开头程序程序的流程图程序游玩的效果下一篇博客要说的东西 开头 大家好&#xff0c;我叫这是我58。 程序 #include <iostream> using namespace std; void printmaze(char strmaze[5][5][5]) {cout << "-----" << endl;int i 0;int ia 0…...

后进先出(LIFO)详解

LIFO 是 Last In, First Out 的缩写&#xff0c;中文译为后进先出。这是一种数据结构的工作原则&#xff0c;类似于一摞盘子或一叠书本&#xff1a; 最后放进去的元素最先出来 -想象往筒状容器里放盘子&#xff1a; &#xff08;1&#xff09;你放进的最后一个盘子&#xff08…...

《Qt C++ 与 OpenCV:解锁视频播放程序设计的奥秘》

引言:探索视频播放程序设计之旅 在当今数字化时代,多媒体应用已渗透到我们生活的方方面面,从日常的视频娱乐到专业的视频监控、视频会议系统,视频播放程序作为多媒体应用的核心组成部分,扮演着至关重要的角色。无论是在个人电脑、移动设备还是智能电视等平台上,用户都期望…...

【入坑系列】TiDB 强制索引在不同库下不生效问题

文章目录 背景SQL 优化情况线上SQL运行情况分析怀疑1:执行计划绑定问题?尝试:SHOW WARNINGS 查看警告探索 TiDB 的 USE_INDEX 写法Hint 不生效问题排查解决参考背景 项目中使用 TiDB 数据库,并对 SQL 进行优化了,添加了强制索引。 UAT 环境已经生效,但 PROD 环境强制索…...

《通信之道——从微积分到 5G》读书总结

第1章 绪 论 1.1 这是一本什么样的书 通信技术&#xff0c;说到底就是数学。 那些最基础、最本质的部分。 1.2 什么是通信 通信 发送方 接收方 承载信息的信号 解调出其中承载的信息 信息在发送方那里被加工成信号&#xff08;调制&#xff09; 把信息从信号中抽取出来&am…...

Java 加密常用的各种算法及其选择

在数字化时代&#xff0c;数据安全至关重要&#xff0c;Java 作为广泛应用的编程语言&#xff0c;提供了丰富的加密算法来保障数据的保密性、完整性和真实性。了解这些常用加密算法及其适用场景&#xff0c;有助于开发者在不同的业务需求中做出正确的选择。​ 一、对称加密算法…...

NXP S32K146 T-Box 携手 SD NAND(贴片式TF卡):驱动汽车智能革新的黄金组合

在汽车智能化的汹涌浪潮中&#xff0c;车辆不再仅仅是传统的交通工具&#xff0c;而是逐步演变为高度智能的移动终端。这一转变的核心支撑&#xff0c;来自于车内关键技术的深度融合与协同创新。车载远程信息处理盒&#xff08;T-Box&#xff09;方案&#xff1a;NXP S32K146 与…...

【Linux】Linux 系统默认的目录及作用说明

博主介绍&#xff1a;✌全网粉丝23W&#xff0c;CSDN博客专家、Java领域优质创作者&#xff0c;掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域✌ 技术范围&#xff1a;SpringBoot、SpringCloud、Vue、SSM、HTML、Nodejs、Python、MySQL、PostgreSQL、大数据、物…...

SQL Server 触发器调用存储过程实现发送 HTTP 请求

文章目录 需求分析解决第 1 步:前置条件,启用 OLE 自动化方式 1:使用 SQL 实现启用 OLE 自动化方式 2:Sql Server 2005启动OLE自动化方式 3:Sql Server 2008启动OLE自动化第 2 步:创建存储过程第 3 步:创建触发器扩展 - 如何调试?第 1 步:登录 SQL Server 2008第 2 步…...

用鸿蒙HarmonyOS5实现中国象棋小游戏的过程

下面是一个基于鸿蒙OS (HarmonyOS) 的中国象棋小游戏的实现代码。这个实现使用Java语言和鸿蒙的Ability框架。 1. 项目结构 /src/main/java/com/example/chinesechess/├── MainAbilitySlice.java // 主界面逻辑├── ChessView.java // 游戏视图和逻辑├──…...

GraphQL 实战篇:Apollo Client 配置与缓存

GraphQL 实战篇&#xff1a;Apollo Client 配置与缓存 上一篇&#xff1a;GraphQL 入门篇&#xff1a;基础查询语法 依旧和上一篇的笔记一样&#xff0c;主实操&#xff0c;没啥过多的细节讲解&#xff0c;代码具体在&#xff1a; https://github.com/GoldenaArcher/graphql…...