因同事的需求是想前端导出excel表格，网上找了一些demo，自己修改了一下，可能以后会用到，记录下来吧，兼容ie和一些主流浏览器，ie可能会报错，原因参考 这里，edge 浏览器还没有办法导出，正在尝试...

<!DOCTYPE html>

<html lang="en">

    <head>

        <meta charset="utf-8">

        <title>table 导出excel表格</title>

    </head>

    <body>

        <div>

            <button type="button" onclick="exportExcel('tableExcel')">导出Excel</button>

        </div>

        <div id="myDiv">

            <table id="tableExcel" width="100%" border="1" cellspacing="0" cellpadding="0">

                <tr>

                    <td colspan="5" align="center">html 表格导出道Excel</td>

                </tr>

                <tr>

                    <td>列标题1</td>

                    <td>列标题2</td>

                    <td>类标题3</td>

                    <td>列标题4</td>

                    <td>列标题5</td>

                </tr>

                <tr>

                    <td>aaa</td>

                    <td>bbb</td>

                    <td>ccc</td>

                    <td>ddd</td>

                    <td>eee</td>

                </tr>

                <tr>

                    <td>AAA</td>

                    <td>BBB</td>

                    <td>CCC</td>

                    <td>DDD</td>

                    <td>EEE</td>

                </tr>

                <tr>

                    <td>FFF</td>

                    <td>GGG</td>

                    <td>HHH</td>

                    <td>III</td>

                    <td>JJJ</td>

                </tr>

            </table>

        </div>  

        <script>

            var idTmr;

              function  getExplorer() {

                var explorer = window.navigator.userAgent;

                console.log(explorer);

                //ie

                if (explorer.indexOf("Trident") >= 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';

                }

            } 

            function exportExcel(tableid) {

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

                    var curTbl = document.getElementById(tableid);

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

                    var oWB = oXL.Workbooks.Add();

                    var oSheet = oWB.ActiveSheet;

                    var sel = document.body.createTextRange();

                    sel.moveToElementText(curTbl);

                    sel.select();

                    sel.execCommand("Copy");

                    oSheet.Paste();

                    oXL.Visible = true;

                }

                else{

                    tableToExcel(tableid)

                }

            }   

            var tableToExcel = (function() {

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

                        template = '<html><head><meta charset="UTF-8"></head><body><table>{table}</table></body></html>',

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

                        format = function(s, c) {

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

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

                return function(table, name) {

                    if (!table.nodeType) table = document.getElementById(table)

                    var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML}

                    window.location.href = uri + base64(format(template, ctx))

                }

            })();

        </script>

    </body>

</html>

原文来自: 这里

原生JavaScript 导出excel表格（兼容ie和其他主流浏览器）的更多相关文章

  1. Element-ui组件库Table表格导出Excel表格

    安装npm install --save xlsx file-saver 两个插件的详细地址在下面 https://github.com/SheetJS/js-xlsxhttps://github.c ...

  2. PHP导入导出excel表格图片(转)

    写excel的时候,我用过pear的库,也用过pack压包的头,同样那些利用smarty等作的简单替换xml的也用过,csv的就更不用谈了.呵呵.(COM方式不讲了,这种可读的太多了,我也写过利用wp ...

  3. HTML导出Excel文件(兼容IE及所有浏览器)

    注意:IE浏览器需要以下设置: 打开IE,在常用工具栏中选择“工具”--->Internet选项---->选择"安全"标签页--->选择"自定义级别&q ...

  4. PHP导入导出excel表格图片的代码和方法大全

    基本上导出的文件分为两种: 1:类Excel格式,这个其实不是传统意义上的Excel文件,只是因为Excel的兼容能力强,能够正确打开而已.修改这种文件后再保存,通常会提示你是否要转换成Excel文件 ...

  5. NPOI导出excel表格应用

    最近接到一个需求,在原有系统上做二次开发 ,要求导出DataGridView数据到Excel表格中.要求如下: 兼容所有excel版本: 导出后excel各列的样式,字段类型不变. 成型如下:

  6. vue 纯前端导出 excel 表格

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

  7. html js 导出excel表格

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

  8. java中使用jxl导出Excel表格详细通用步骤

    该方法一般接收两个参数,response和要导出的表格内容的list. 一般我们将数据库的数据查询出来在页面进行展示,根据用户需求,可能需要对页面数据进行导出. 此时只要将展示之前查询所得的数据放入s ...

  9. .NET环境下导出Excel表格的两种方式和导入两种类型的Excel表格

    一.导出Excel表格的两种方式,其中两种方式指的是导出XML数据类型的Excel(即保存的时候可以只需要修改扩展名为.xls)和真正的Excel这两种. using System; using Sy ...

随机推荐

  1. Unity3D中随机函数的应用

    电子游戏中玩家与系统进行互动的乐趣绝大多数取决于事件发生的不可预知性和随机性.在unity3D的API中提供了Random类来解决随机问题. 最简单的应用就是在数组中随机选择一个元素,使用Random ...

  2. telerik自定义皮肤的制作及用法

    1. 打开telerik 官网 http://stylebuilder.telerik.com/ 2. 选择一个皮肤做为基础皮肤,并选择要制作的控件,并新取一个名字.比如选择皮肤Silk为基础皮肤,新 ...

  3. WPF 自定义快速实现线程等待函数FastTask

    在WPF实现 我们常常需要实现这个目标:线程里面执行复杂的任务,然后主窗体等待动画 我把我最简单的东西给包了一下,更方便使用,大家也可以方便使用 1:添加CommHelper类 FastTask方法 ...

  4. matlab学习笔记---（1）

    Matlab学习笔记 一. Desktop Basics (Matlab 基础知识) 当你打开Matlab的时候,matlab按照以下默认的方式展示出来. 该桌面主要包括以下几部分内容: 当前文件夹: ...

  5. webstrom 一直反复indexing

    从网上找了找答案 好多说 把大的静态文件exclude(在项目文件上右击-->Mark Directory As -->exclude)出去,可是不管用.我刚发生的情况是一直刷新,一遍一遍 ...

  6. (1)Oracle基础--用户与登录

    一.用户 · 系统用户 <1> sys,system  sys和system是权限比较高的用户,且sys比system权限高.使用sys登录必须使用sysdba或者sysoper的权限,而 ...

  7. [JavaScript] iframe加载完成事件

    //iframe加载完成后,对其子元素进行操作 var iframe = document.getElementById("re-img"); if (iframe.attachE ...

  8. Chrome谷歌浏览器已停用不支持的扩展程序解决方法

    在不能上外网的情况下解决该问题: http://www.liu16.com/post/Chrome_2447.html

  9. 更换SSL证书

    1.申请证书,需要提供完整域名(例如:xxx.aaa.com),会和证书完全匹配. 2.将证书上传到web服务器,例如我的nginx,在server中指定证书路径. 3.重启web服务器.(这个证书和 ...

  10. SSH免密码远程登录Linux

    1. 有A,B两台机(Linux/unix), 要想从A用ssh远程登录到B上(假设各自的IP,A:192.168.100:B:192.168.1.104). 2. 在A机上,用“ssh-keygen ...