注意：IE浏览器需要以下设置：
打开IE，在常用工具栏中选择“工具”--->Internet选项---->选择"安全"标签页--->选择"自定义级别"--->弹出的窗口中找到ActiveX控件和插件--->
将"ActiveX控件自动提示"
"对没有标记安全的ActiveX控件进行初始化和脚本运行"
"下载未签名的ActiveX控件"
三项 选择启用 即可!
HtmlExportToExcel.js 代码
?1 /* ?2 ?* HTML导出Excel文件(兼容IE及所有浏览器) ?3 ?* @param {any} tableid ?table父元素ID ?4 ?* @param {any} filename 文件名称 ?5 ?*/ ?6 function HtmlExportToExcel(tableid, filename) { ?7 ????if (getExplorer() === ‘ie‘ || getExplorer() === undefined) { ?8 ????????HtmlExportToExcelForIE(tableid, filename); ?9 ????} 10 ????else { 11 ????????HtmlExportToExcelForEntire(tableid, filename); 12 ????} 13 } 14 ?15 //IE浏览器导出Excel 16 function HtmlExportToExcelForIE(tableId, filename) { 17 ????try { 18 ????????var oXL = new ActiveXObject("excel.Application"); 19 ????????//oXL.Visible = true; 20 ????????//oXL.ScreenUpdating = false; 21 ????} catch (e1) { 22 ????????try { 23 ????????????oXL = new ActiveXObject("et.Application"); 24 ????????} catch (e2) { 25 ????????????alert(e2.description + "\n\n\n要使用EXCEL对象，您必须安装Excel电子表格软件\n或者,需要安装Kingsoft ET软件\n\n同时浏览器须使用“ActiveX 控件”，您的浏览器须允许执行控件。"); 26 ????????????return; 27 ????????} 28 ????} 29 ????//创建AX对象excel 30 ????var oWB = oXL.Workbooks.Add(); 31 ????//获取workbook对象 32 ????var xlsheet = oWB.Worksheets(1); 33 ?34 ????var elTable = document.getElementById(tableId); 35 ?36 ????//替换掉表格td中隐藏的html元素 37 ????var tableHtml = ReplaceHtml(elTable.innerHTML); 38 ?39 ????var newTable = document.getElementById("newData"); 40 ????//console.log(); 41 ????newTable.innerHTML = tableHtml; 42 ?43 ????//激活当前sheet 44 ????var sel = document.body.createTextRange(); 45 ????sel.moveToElementText(newTable); 46 ????//把表格中的内容移到TextRange中 47 ????sel.select; 48 ????//全选TextRange中内容 49 ????sel.execCommand("Copy"); 50 ????//复制TextRange中内容 51 ????xlsheet.Paste(); 52 ????//粘贴到活动的EXCEL中 53 ????oXL.Visible = true; 54 ????//设置excel可见属性 55 ?56 ????newTable.innerHTML = ""; 57 ?58 ????try { 59 ????????//设置 sheet 名称 60 ????????xlsheet.Name = filename; 61 ????????var fname = oXL.Application.GetSaveAsFilename(filename + ".xls", "Excel Spreadsheets (*.xls), *.xls"); 62 ????} catch (e) { 63 ????????print("Nested catch caught " + e); 64 ????} finally { 65 ????????oWB.SaveAs(fname); 66 ????????oWB.Close(); 67 ????????//xls.visible = false; 68 ????????oXL.ScreenUpdating = true; 69 ????????oXL.Quit(); 70 ????} 71 } 72 ?73 //非IE浏览器导出Excel 74 var HtmlExportToExcelForEntire = (function () { 75 ????var uri = ‘data:application/vnd.ms-excel;base64,‘, 76 ????????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]-->‘ + 77 ????????????/**********这部分是加载表格的样式 ?没有样式可以省略 start**********/ 78 ????????????‘<style type="text/css">‘ + 79 ????????????‘.tablefrom {width: 100%;border-collapse: collapse;}‘ + 80 ????????????‘.tablefrom, .tablefrom td, .tablefrom th {text-align: center;font: 12px Arial, Helvetica, sans-serif;border: 1px solid #fff;}‘ + 81 ????????????‘.tablefrom th{background:#328aa4;color:#fff;}‘ + 82 ????????????‘.tablefrom td{background:#e5f1f4;}‘ + 83 ????????????‘.tablefrom .BlueBgColor td {color: #fff;background-color: #0070c0;}‘ + 84 ????????????‘.tablefrom .LightBlueBgColor td {color: #000000;background-color: #bdd7ee;}‘ + 85 ????????????‘.tablefrom ?tr .BlueBgColorTd { color: #fff;background-color: #0070c0;}‘ + 86 ????????????‘.tablefrom tr .LightBlueBgColorTd {color: #000000;background-color: #bdd7ee;}‘ + 87 ????????????‘</style>‘ 88 ????????????/**********这部分是加载表格的样式 ?没有样式可以省略 end**********/ 89 ????????????+ ‘</head><body>{table}</body></html>‘, 90 ????????base64 = function (s) { return window.btoa(unescape(encodeURIComponent(s))); }, 91 ????????format = function (s, c) { return s.replace(/{(\w+)}/g, function (m, p) { return c[p]; }); }; 92 ????return function (table, name) { 93 ????????if (!table.nodeType) { table = document.getElementById(table); } 94 ????????//替换掉表格td中隐藏的html元素 95 ????????var strHTML = ReplaceHtml(table.innerHTML); 96 ????????var ctx = { worksheet: name || ‘Worksheet‘, table: strHTML }; 97 ?????????98 ????????document.getElementById("dlink").href = uri + base64(format(template, ctx)); 99 ????????document.getElementById("dlink").download = name + ".xls";100 ????????document.getElementById("dlink").click();101 ????};102 })();103 104 //获取当前使用浏览器105 function getExplorer() {106 ????var explorer = window.navigator.userAgent;107 ????//ie 108 ????if (explorer.indexOf("MSIE") >= 0) {109 ????????return ‘ie‘;110 ????}111 ????//firefox 112 ????else if (explorer.indexOf("Firefox") >= 0) {113 ????????return ‘Firefox‘;114 ????}115 ????//Chrome116 ????else if (explorer.indexOf("Chrome") >= 0) {117 ????????return ‘Chrome‘;118 ????}119 ????//Opera120 ????else if (explorer.indexOf("Opera") >= 0) {121 ????????return ‘Opera‘;122 ????}123 ????//Safari124 ????else if (explorer.indexOf("Safari") >= 0) {125 ????????return ‘Safari‘;126 ????}127 }128 129 //将隐藏的HTML元素替换掉130 function ReplaceHtml(tableHtml) {131 ????var radioValue = $(‘input[name="bedStatus"]:checked ‘).val();132 ????if (radioValue === ‘yuan‘) {133 ????????tableHtml = tableHtml.replace(/<span class="span_wanyuan" [^<>]*?>(.*?)<\/span>/gi, "");134 ????}135 ????else if (radioValue === ‘wanyuan‘) {136 ????????tableHtml = tableHtml.replace(/<span class="span_yuan" [^<>]*?>(.*?)<\/span>/gi, "");137 ????}138 ????return tableHtml;139 }另外，我的功能需要替换掉td中隐藏的html元素，所以需要将新的table复制到另一个隐藏的div中。
页面html代码：
1 <div id="divData"> 2 ????<table class="tablefrom" id="tbData" style="width: 100%; border-collapse: collapse;" border="0" cellspacing="0"> 3 ????????<tbody> 4 ????????????<tr> 5 ????????????????<th rowspan="2" colspan="2" scope="col">序号</th> 6 ????????????????<th style="min-width: 70px;" rowspan="2" scope="col">项目</th> 7 ????????????????<th style="min-width: 50px;" rowspan="2" scope="col">维度</th> 8 ????????????????<th style="min-width: 50px;" rowspan="2" scope="col">本月资金</th> 9 ????????????????<th rowspan="2" colspan="1" scope="col">某部门</th>10 ????????????????<th colspan="2" scope="col">支付</th>11 ????????????</tr>12 ????????????<tr>13 ????????????????<th style="min-width: 50px;" scope="col">执行</th>14 ????????????????<th style="min-width: 50px;" scope="col">余额</th>15 ????????????</tr>16 ????????????<tr>17 ????????????????<td style="color: rgb(0, 0, 0); font-weight: bold; background-color: rgb(189, 215, 238);" rowspan="163" scope="col">经营费用类</td>18 ????????????????<td style="min-width: 50px;" rowspan="3" scope="col">1</td>19 ????????????????<td rowspan="3" scope="col">销售退款</td>20 ????????????????<td scope="col">实际</td>21 ????????????????<td style="color: rgb(0, 0, 0); background-color: rgb(189, 215, 238);" scope="col"><span class="span_yuan">100000</span><span class="span_wanyuan" style="display: none;">10</span></td>22 ????????????????<td scope="col"><span class="span_yuan">100000</span><span class="span_wanyuan" style="display: none;">10</span></td>23 ????????????????<td scope="col"><span class="span_yuan">100000</span><span class="span_wanyuan" style="display: none;">10</span></td>24 ????????????????<td scope="col"><span class="span_yuan">900000</span><span class="span_wanyuan" style="display: none;">90</span></td>25 ????????????</tr>26 ????????????<tr>27 ????????????????<td scope="col">计划</td>28 ????????????????<td style="color: rgb(0, 0, 0); background-color: rgb(189, 215, 238);" scope="col"><span class="span_yuan">1000000</span><span class="span_wanyuan" style="display: none;">100</span></td>29 ????????????????<td scope="col"><span class="span_yuan">1000000</span><span class="span_wanyuan" style="display: none;">100</span></td>30 ????????????????<td scope="col">-</td>31 ????????????????<td scope="col">-</td>32 ????????????</tr>33 ????????????<tr>34 ????????????????<td scope="col">差额</td>35 ????????????????<td style="color: rgb(0, 0, 0); background-color: rgb(189, 215, 238);" scope="col"><span class="span_yuan">900000</span><span class="span_wanyuan" style="display: none;">90</span></td>36 ????????????????<td scope="col"><span class="span_yuan">900000</span><span class="span_wanyuan" style="display: none;">90</span></td>37 ????????????????<td scope="col">-</td>38 ????????????????<td scope="col">-</td>39 ????????????</tr>40 ????????</tbody>41 ????</table>42 </div>43 <div id="newData" style="display: none;"></div>
HTML导出Excel文件(兼容IE及所有浏览器)
原文地址：https://www.cnblogs.com/wsk198726/p/9707029.html