<!DOCTYPE html>

<html>

<head>

<title>table2xls</title>

<meta charset="utf-8">

<style type="text/css">

body,

table {

font-size: 12px;

}

table {

table-layout: fixed;

empty-cells: show;

border-collapse: collapse;

margin: 0 auto;

}

td {

height: 30px;

}

h1,

h2,

h3 {

font-size: 12px;

margin: 0;

padding: 0;

}

.table {

border: 1px solid #cad9ea;

color: #666;

}

.table th {

background-repeat: repeat-x;

height: 30px;

}

.table td,

.table th {

border: 1px solid #cad9ea;

padding: 0 1em 0;

}

.table tr.alter {

background-color: #f5fafe;

}

div {

margin-top: 2rem;

}

</style>

</head>

<body>

<div>

<table width="90%" class="table" id="table_outputXLS">

<tr>

<th> 学号 </th>

<th> 姓名 </th>

<th> 平时 </th>

<th> 期中 </th>

<th> 实验（践）</th>

<th> 其它 </th>

<th> 期末 </th>

<th> 总评 </th>

</tr>

<tr>

<td>1</td>

<td>1</td>

<td>1</td>

<td>1</td>

<td>1</td>

<td>1</td>

<td>1</td>

<td>1</td>

</tr>

<tr class="alter">

<td>2</td>

<td>2</td>

<td>2</td>

<td>2</td>

<td>2</td>

<td>2</td>

<td>2</td>

<td>2</td>

</tr>

</table>

</div>

<div style="margin:2rem auto;width: 6rem;">

<button type="button" id="btn_outputXLS">导出</button>

</div>

</body>

</html>

<script type="text/javascript">

//HTMLtable表格拷贝到EXCEL中(引用自：https://www.cnblogs.com/zhj-Acmen/p/7298936.html)

var idTmr; // 释放资源计时器 — IE

var fileName = "导出表格";

window.onload = function() {

$$('btn_outputXLS').addEventListener("click", function() {

outputXLS('table_outputXLS');

});

}

// 表格导出到EXCEL中

function outputXLS(tableid) {

if ($$(tableid).rows.length > 2) {

if (getExplorer() == 'ie') {

//AllAreaExcel(tableid);

tableToXls_isIE(tableid);

} else {

tableToXls_notIE(tableid);

}

} else {

alter("表内有内容才能导出!");

}

}

// table 导出为 xls - IE，需要降低浏览器安全级别，成功率低

function tableToXls_isIE(tableid) {

var curTbl = $$(tableid);

var oXL = new ActiveXObject("Excel.Application");

//创建AX对象excel

var oWB = oXL.Workbooks.Add();

//获取workbook对象

var xlsheet = oWB.Worksheets(1);

//激活当前sheet

var sel = document.body.createTextRange();

sel.moveToElementText(curTbl);

//把表格中的内容移到TextRange中

sel.select;

//全选TextRange中内容

sel.execCommand("Copy");

//复制TextRange中内容

xlsheet.Paste();

//粘贴到活动的EXCEL中

oXL.Visible = true;

//设置excel可见属性

try {

var fname = oXL.Application.GetSaveAsFilename(fileName + ".xls", "Excel Spreadsheets (*.xls), *.xls");

} catch (e) {

print("导出错误：" + e);

} finally {

oWB.SaveAs(fname);

oWB.Close(savechanges = false);

//xls.visible = false;

oXL.Quit();

oXL = null;

//结束excel进程，退出完成

idTmr = window.setInterval("Cleanup();", 1);

}

}

// table 导出为 xls - 非IE

function tableToXls_notIE(tableid) {

let uri = 'data:application/vnd.ms-excel;base64,';

let template = '<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><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>';

let base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) };

let format = function(s, c) {

return s.replace(/{(\w+)}/g,

function(m, p) { return c[p]; })

};

// 导出

function outputHandler(name) {

let table = $$(tableid);

let ctx = { worksheet: name || 'Worksheet1', table: table.innerHTML };

let a = document.createElement("a");

a.href = uri + base64(format(template, ctx));

a.download = fileName;

a.click();

};

outputHandler();

}

// 判断浏览器

function getExplorer() {

var explorer = window.navigator.userAgent;

//ie

if (explorer.indexOf("MSIE") >= 0) {

return 'ie';

}

//firefox

else if (explorer.indexOf("Firefox") >= 0) {

return 'Firefox';

}

//Chrome

else if (explorer.indexOf("Chrome") >= 0) {

return 'Chrome';

}

//Opera

else if (explorer.indexOf("Opera") >= 0) {

return 'Opera';

}

//Safari

else if (explorer.indexOf("Safari") >= 0) {

return 'Safari';

}

}

// 释放资源 - IE

function Cleanup() {

window.clearInterval(idTmr);

CollectGarbage(); // IE 的一个特有属性，用于释放内存的

}

// 工具函数 - 通过 id 获取元素

function $$(id) {

return document.getElementById(id);

}

</script>

copy大神的代码：https://www.cnblogs.com/nb08611033/p/8288042.html

html导出表格xls格式的更多相关文章

  1. 利用PHPExcel将数据导出到xls格式的excel文件

    在开发某地的经营许可证管理系统的时候需要将数据导出打excel文件,虽然一年前做某集团的ERP的时候用到过一次导入和导出,但是那时候太忙没时间写博客,一年过去了我也忘的差不多了,所以趁着今天将此次的使 ...

  2. 在ASP.NET Web Forms中使用页面导出伪xls Excel表格

    将数据导出为Excel表格是比较常见的需求,也有很多组件支持导出真正的Excel表格.由于Excel能打开HTML文件,并支持其中的table元素以及p之类的文本元素的显示,所以把.html扩展名改为 ...

  3. 使用Apache POI导出Excel小结--导出XLS格式文档

    使用Apache POI导出Excel小结 关于使用Apache POI导出Excel我大概会分三篇文章去写 使用Apache POI导出Excel小结--导出XLS格式文档 使用Apache POI ...

  4. 前端 vue/react 或者 js 导入/导出 xlsx/xls (带样式)表格的功能

    第一种导出表格的功能: yarn add xlsx script-loader file-saver xlsx-style 效果展示 xlsx-style的bug修复:node_module/xlsx ...

  5. MySQL数据库如何与EXCEL的XLS格式相互转换

    1 将SQL导出为EXCEL方法,有如下数据库(my_impa),里面有两张表 2 如果是EXCEL格式,一定要勾选"将字段名称放在首行",否则待会儿导入的时候就需要你手工新建字段 ...

  6. java将list<T>导出为xls文件

    一.action层 /** * 导出list */ @SuppressWarnings("unchecked") public void exportBatch() { reque ...

  7. qt技巧--使用html导出表格替代excel

            曾经为qt不能直接导出excel而困扰,后来经过深入了解,得知qt支持xml国际语言,html是xml的一种.html是做网页的,相信大家比较熟悉.所以使用html的<table ...

  8. 关于Java中excel表格导出的总结（Java程序导出模板和Java根据模板导出表格两种实现方式）

    导出excel通用模板(程序定义模板导出) 转载原文:https://www.jianshu.com/p/5c7b359a159c 如下代码,本方法主要用于程序定义模板格式,并导出文件.该方法将定义和 ...

  9. POI导入导出Excel(HSSF格式，User Model方式)

    1.POI说明 Apache POI是Apache软件基金会的开源代码库, POI提供对Microsoft Office格式档案读和写的功能. POI支持的格式: HSSF - 提供读写Microso ...

  10. Vue导出模板、使用前端js办法导出表格数据、导入表格前端读取表格数据、导入表格发送后端读取数据

    以下是几种用的较多的函数方法,可以参考使用. // 導出1 myExport() { // post請求文件寫法1 const url = 'http://XXXX/XXXX/XXXX/XXXX' c ...

随机推荐

  1. iOS开发之权限申请说明key

    我们申请不同的权限需要对应的key,在info.plist内加上对用户的提示语 麦克风权限 NSMicrophoneUsageDescription 相机权限 NSCameraUsageDescrip ...

  2. react 本地 DevServer启动之后找不到静态资源404

    起因:更改路由嵌套方式,基础路径不是 '/' 本地启动项目之后 请求静态资源404,前边加了路由路径, 原因:打包之后相对路径改变了,解决:在output里的publicPath :'/'

  3. Vue2 中keyup.enter触发问题！

    结合Element-UI开发的过程需求需要添加表单的默认Enter事件,但是当文本框或者元素没有获取焦点的时候回车事件未触发: 存在元素输入框修改语句:@keyup.native.enter 如果是f ...

  4. Java基础-运算符、包机制、JavaDoc生成文档

    运算符 Java语言支持如下运算符:优先级() 算术运算符:+,-,*,/,%,++,- 赋值运算符:= 关系运算符:>,<,>=,<=,==,!=,instanceof 逻辑 ...

  5. DEDE在文章列表文章没有缩略图的不显示图片,有的则显示缩略图

    解决在文章列表文章没有缩略图的不显示图片,有的则显示缩略图在5.3最开始的版本.好象是有这个功能的. 就是在列表里..如果改文章没有缩略图则不显示默认的 没有缩略图的土片.如果有则显示缩略图 但在后续 ...

  6. python常用的六个字符串处理方法

    1.upper(将小写字母转换为大写) 语法: str.upper() 参数: NA 实例: a = 'abc' b = a.upper() print(b) 结果: ABC 2.lower(将小写字 ...

  7. （已解决）用phpstudy8创建个数据库（非root），结果没有访问权限。

    1. 问题 用phpstudy_pro,即最新版本,创建非root用户的数据库,然后后台访问它却提示没有权限. 2. 解决办法 进入系统自带的user表,修改权限.具体操作如下: a. 首先找到自己用 ...

  8. Python学习笔记（一）环境确认

    1.安装环境 1)python解释器 版本3.10.2 安装完毕后在命令提示符窗口中输入python显示版本信息 2)开发工具 pycharm 2021.1.3 2.新建项目 创建项目后修改解释器配置 ...

  9. 在axios拦截器js文件中无法使用vue-router问题

    如果在axios设置拦截器的js文件或者说在vue-router路由配置文件,配置好的路由文件以外的js文件中使用 import {useRouter} from 'vue-router' 系统不会默 ...

  10. 梦想云图Node.JS服务 （网页CAD，在线CAD ）

    说明 后台提供梦想Node.JS服务,方便调用控件后台功能,Windows服务程序所在目录:Bin\MxDrawServer\Windows,Linux服务程序所在目录:Bin\Linux\MxDra ...