JS将html导入excel方法

一.导出为CSV文件：

    直接将数据加上逗号“，” 按照逗号分隔符导出成csv表，缺点就是不能进行背景色修改这些样式。

直接贴代码：

//写入CSV

html:

  <button id="export_teardown" class="btn btn-default btn-success" style="margin-left: 8px">导出表格</button>

js:

 $('#export_teardown').click(function(){

           TabletoCsv()

        })

        //导出CSV表格

        function TabletoCsv() {

            user_num = $('.eip_release_tablediv .panel-group .panel').length

            user_str = ""

            console.log(user_num)

            for(i=0; i<user_num; i++){

                user_name = $('.user_name')[i].innerText.trim()

                email = $('.email')[i].innerText.trim()

                notify_email = $('.notify_email')[i].innerText.trim()

                phone = $('.phone')[i].innerText.trim()

                company_name = $('.company_name')[i].innerText.trim()

                var user_title = "用户名" + ',' + "登录邮箱" + ',' + "通知邮箱" + ',' + "手机号" + ',' + "公司名" + '\n'

                var str = user_name + ',' + email + ',' + notify_email + ',' + phone + ',' + company_name + '\n'

                var tear_down_usr_title = "区域" + ',' + "主机ID" + ',' + "主机名" + ',' + "镜像名" + ',' + "镜像ID" + ',' + "迁移时间" + ',' + "迁移状态" + '\n'

                var tear_down_tr_num = $('.panel').find("tbody")[i].children.length

                var std = ""

                for(j=0;  j<tear_down_tr_num; j++){

                    var tear_down_td= $('.panel').find("tbody")[i].children[j].children

                    for(k=0; k<tear_down_td.length; k++){

                        td = tear_down_td[k].innerText.trim() + ','

                        std = std + td

                    }

                    std = std + '\n'

                }

                var user_info = user_title + str + tear_down_usr_title + std + '\n'

                user_str = user_str + user_info

            }

            str = encodeURIComponent(user_str)

            console.log(str)

            var temp = document.createElement("a")

            temp.style.display = "none"

            temp.download = "导出表格.csv"

            temp.href = "data:text/csv;charset=utf-8,\ufeff" + str

            temp.click()

            return temp

        }

二.导出成EXCEL表

  将数据封装成table，带样式导出成excel。

直接上代码：

//写入EXCEL

html：

button id="export_teardown" onclick="ToExcel()" class="btn btn-default btn-success" style="margin-left: 8px">导出表格>

js:

  //导出excel

        var idTmr;

        function  getExplorer() {

            var explorer = window.navigator.userAgent ;

            //ie

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

                return 'ie';

            }

            //firefox

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

                console.log(explorer)

                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 ToExcel(tableid) {

            if(getExplorer()=='ie')

            {

                var curTbl = document.getElementById(tableid);

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

                var oWB = oXL.Workbooks.Add();

                var xlsheet = oWB.Worksheets(1);

                var sel = document.body.createTextRange();

                sel.moveToElementText(curTbl);

                sel.select();

                sel.execCommand("Copy");

                xlsheet.Paste();

                oXL.Visible = true;

                try {

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

                } catch (e) {

                    print("Nested catch caught " + e);

                } finally {

                    oWB.SaveAs(fname);

                    oWB.Close(savechanges = false);

                    oXL.Quit();

                    oXL = null;

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

                }

            }

            else

            {

                tableToExcel(tableid)

            }

        }

        function Cleanup() {

            window.clearInterval(idTmr);

            CollectGarbage();

        }

        var tableToExcel = (function() {

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

            user_num = $('.eip_release_tablediv .panel-group .panel').length

            user= ""

            console.log(user_num)

            for(i=0; i<user_num; i++){

                user_name = $('.user_name')[i].innerText.trim()

                email = $('.email')[i].innerText.trim()

                notify_email = $('.notify_email')[i].innerText.trim()

                phone = $('.phone')[i].innerText.trim()

                company_name = $('.company_name')[i].innerText.trim()

                var user_title = "<tr><td style='background-color:rgb(221,235,247)'>用户名</td>" + "<td style='background-color:rgb(221,235,247)'>登录邮箱</td>" + "<td style='background-color:rgb(221,235,247)'>通知邮箱</td>" + "<td style='background-color:rgb(221,235,247)'>手机号</td>" 
+ "<td style='background-color:rgb(221,235,247)'>公司名</td>" + "<td style='background-color:rgb(221,235,247)'></td><td style='background-color:rgb(221,235,247)'></td></tr>"

                var str = "<tr><td style='background-color:rgb(221,235,247)'>" + user_name + '</td><td style=\'background-color:rgb(221,235,247)\'>' + email + '</td><td style=\'background-color:rgb(221,235,247)\'>' + notify_email + '</td><td style=\'background-color:rgb(221,235,247)\'>'
+ phone + '</td><td style=\'background-color:rgb(221,235,247)\'>' + company_name + '</td><td style=\'background-color:rgb(221,235,247)\'></td><td style=\'background-color:rgb(221,235,247)\'></td></tr>'

         
4000
       var tear_down_usr_title = "<tr><td>区域</td>" + "<td>主机ID</td>"+ "<td>主机名</td>"  + "<td>镜像名</td>"  + "<td>镜像ID</td>" + "<td>迁移时间</td>" + "<td>迁移状态</td></tr>"

                var tear_down_tr_num = $('.panel').find("tbody")[i].children.length

                var std = ""

                for(j=0;  j<tear_down_tr_num; j++){

                    var tear_down_td= $('.panel').find("tbody")[i].children[j].children

                    for(k=0; k<tear_down_td.length; k++){

                        td = '<td>' + tear_down_td[k].innerText.trim() + '</td>'

                        std = std + td

                    }

                    std = std + '<tr>'

                }

{##}

                var user = user + user_title + str + tear_down_usr_title + std

            }

            table = user

            template = '<html><head><meta charset="UTF-8"></head><body><table border="1">'+ 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) {

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

            }

        })()