这个使用js 导出excel，可以集成其他语言，可以html,php,asp ,java 等，自己喜欢用那种语言就用哪种，使用非常方便。js是使用tableExport.js ，jquery-3.2.1.min.js 以及FileSaver.min.js

这个tableExport.js js插件很强大，有兴趣的可以搜索一下，这里分享个html + js 的导出excel表格。

 1 <!DOCTYPE html>

 2 <html>

 3 <head>

 4   <meta charset="UTF-8">

 5   <title>HTML table Export</title>

 6 <script type="text/javascript" src="js/jquery-3.2.1.min.js" ></script>

 7 <script type="text/javascript" src="js/FileSaver.min.js" ></script>

 8 <script type="text/javascript" src="js/tableExport.js" ></script>

 9   <script type="text/javascript">

10     $(document).ready(function() {

11       var Table = document.getElementById ( 'container' );

12       var T = [];

13       var r = 0;

14       var c = 1;

15       var rmax = 5;

16       var cmax = 26;

17

18       T.push('<table id="grid">');

19       T.push('<thead>');

20       T.push('<tr>');

21

22       T.push('<th>col #</th>');

23       while (++c <= cmax+1)

24         T.push('<td>col ' + c + '</td>');

25

26       T.push('</tr>');

27       T.push('</thead>');

28       T.push('<tbody>');

29

30       while (r++ < rmax) {

31         c = 0;

32

33         T.push('<tr>');

34         T.push('<td>' + r + '</td>');

35         while (c++ < cmax)

36           T.push('<td>' + getRandomInt(100,10000) + '</td>');

37         T.push('</tr>');

38       }

39

40       T.push('</tbody>');

41       T.push('</table>');

42

43       Table.innerHTML = T.join ("");

44

45       $('#export').click(function() {

46         $('#grid').tableExport({

47           type:'excel',

48           fileName:"测试"

49

50         });

51         // $('#grid').tableExport({type:'xlsx'});

52       });

53     });

54

55     function getRandomInt(min, max) {

56         return Math.floor(Math.random() * (max - min + 1)) + min;

57     }

58 </script>

59

60 </head>

61   <body>

62     <button id="export">导出 Excel</button>

63     <div id="container">

64     </div>

65   </body>

66 </html>

效果如下图：

这里是整个js+html 源代码，喜欢的拿去下载使用。点击这里下载：js导出excel表格 （访问密码：7509）

如果有不懂得，欢迎交流联系，谢谢。

html js 导出excel表格的更多相关文章

  1. js导出Excel表格

    js导出Excel表格 直接上代码: 红色部分:如果表格数据中有“1/1”这样的值,会在导出的Excel中转化为日期“1月1日”,所以才加上了红色那两句.如果返回值中没有这样的格式,红色部分可以不写. ...

  2. js导出excel表格中较长数字串会变成科学计数法问题

    在做项目中,遇到导出excel表格时,银行账户号数字过长,导出的数字串变为计数法形式,如下图: 网上搜到解决方法,粘贴到这以供学习.不断更新. 原博地址:http://www.cnblogs.com/ ...

  3. js导出excel表格并生成多sheet

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. Html Table用JS导出excel格式问题 导出EXCEL后单元格里的000412341234会变成412341234 7-14 会变成 2018-7-14(7月14) 自定义格式 web利用table表格生成excel格式问题 js导出excel增加表头、mso-number-format定义数据格式 数字输出格式转换 mso-number-format:"\@"

    Html Table用JS导出excel格式问题 我在网上找的JS把HTML Tabel导出成EXCEL.但是如果Table里的数字内容为0开的的导成Excel后会自动删除0,我想以text的格式写入 ...

  5. JS导出excel设置下载的标题/与angular结合冲突

    2017.8更新 此功能与angular结合使用时,最后一行 document.getElementById("dlink").click(); 与angular的ng-click ...

  6. vue 导出excel表格

    对于涉及到数据比较多的管理后台导出excel 表格这个需求就非常的常见了 所以? vue 怎么到处excel表格的? 有两种办法 1:请求接口后台直接给你的是excel文件,你需要做的就是怎么接收ex ...

  7. vue中导出Excel表格

    项目中我们可能会碰到导出Excel文件的需求,一般后台管理系统中居多,将table中展示的数据导出保存到本地.当然我们也可以通过一些处理来修改要导出的数据格式,具体需求具体对待. 1.首先我们需要安装 ...

  8. 在vue中导出excel表格

    初学者学习vue开发,想把前端项目中导出Excel表格,查了众多帖子,踩了很多坑,拿出来与大家分享一下经验. 安装依赖 //npm npm install file-saver -S npm inst ...

  9. vue 纯前端导出 excel 表格

    在开发后台管理系统的时候,很多地方都要用到导出excel 表格,比如将table中的数据导出到本地,那么实现这种需求往往有两种方案: 一.后端开发一个下载链接,前端将这个链接放到 a 标签的 href ...

随机推荐

  1. 南京大学 静态软件分析（static program analyzes）-- introduction 学习笔记

    一.Programming Languages体系 静态程序分析是编程语言中应用层面下的一个细分领域,它是一个非常重要的核心内容. 在理论部分,考虑的是如何设计一个语言的语法和语义,如何设计语言的类型 ...

  2. 不同的子序列问题I

    不同的子序列问题I 作者:Grey 原文地址: 不同的子序列问题I 题目链接 LeetCode 115. 不同的子序列 暴力解法 定义递归函数 int process(char[] str, char ...

  3. docker下node环境搭建

    初始化⼀个NodeJs程序 以下操作必须已经安装了NodeJS. ⾸先创建⼀个空⽂件夹.并创建以下⽂件: server.js package.json Dockerfile .dockerignore ...

  4. JDBC：获取自增长键值的序号

    1.改变的地方  实践: package com.dgd.test; import java.io.FileInputStream; import java.io.FileNotFoundExcept ...

  5. MIT 6.824 Llab2B Raft之日志复制

    书接上文Raft Part A | MIT 6.824 Lab2A Leader Election. 实验准备 实验代码:git://g.csail.mit.edu/6.824-golabs-2021 ...

  6. Visual Studio 生产环境配置方案：SlowCheetah

    原文 SlowCheetah 能满足你不同编译模式产生不同 app.config 配置的需求,已被微软纳入麾下,支持XML,JSON格式. 下面我们用XML的格式来试试如何使用SlowCheetah, ...

  7. 基于ABP实现DDD--领域服务、应用服务和DTO实践

      什么是领域服务呢?领域服务就是领域对象本身的服务,通常是通过多个聚合以实现单个聚合无法处理的逻辑. 一.领域服务实践 接下来将聚合根Issue中的AssignToAsync()方法[将问题分配给用 ...

  8. Golang 盲注脚本

    Golang 盲注脚本 payload部分 其中脚本最重要的环节就是payload部分了,需要如何去闭合,如何构造SQL语句来达到判断的效果.(还有如何绕过waf等等...) bool盲注 下面是最基 ...

  9. H5移动端实现一键复制或长摁复制

    今天接到了一个新的需求,要求我们对表单中的某一个字段进行复制,这个表单是不可选的,拿到需求的时候有点懵,不清楚下手点在哪,后来网上找了找,终于有了点眉目,感觉网上有些是实现不了的,特地在这里记录下进行 ...

  10. php static 和self区别

    static(关键字) 类似于 self(关键字) , 但它指向的是被调用的类(Document) 而不是包含类(DomainObject) , static 和 self 的区别: <?php ...