五種JS導出Excel的方法

來源：懂視網責編：小采時間：2020-11-27 19:59:33

五種JS導出Excel的方法

五種JS導出Excel的方法:本文主要和大家介紹了JS實現導出Excel的五種方法,結合實例形式較為詳細的分析了基于table表格導出Excel文件的相關操作技巧,并附源碼供讀者下載參考,需要的朋友可以參考下，希望能幫助到大家。這五種方法前四種方法只支持IE瀏覽器，最后一個方法支持當前主流的

推薦度：

點擊下載本文 文檔為doc格式

導讀五種JS導出Excel的方法:本文主要和大家介紹了JS實現導出Excel的五種方法,結合實例形式較為詳細的分析了基于table表格導出Excel文件的相關操作技巧,并附源碼供讀者下載參考,需要的朋友可以參考下，希望能幫助到大家。這五種方法前四種方法只支持IE瀏覽器，最后一個方法支持當前主流的

本文主要和大家介紹了JS實現導出Excel的五種方法,結合實例形式較為詳細的分析了基于table表格導出Excel文件的相關操作技巧,并附源碼供讀者下載參考,需要的朋友可以參考下，希望能幫助到大家。

這五種方法前四種方法只支持IE瀏覽器，最后一個方法支持當前主流的瀏覽器（火狐，IE，Chrome，Opera，Safari）

<!DOCTYPE html>
<html>
<head lang="en">
 <meta charset="UTF-8">
 <title>html 表格導出道</title>
 <script language="JavaScript" type="text/javascript">
 //第一種方法
 function method1(tableid) {
 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;
 }
 //第二種方法
 function method2(tableid)
 {
 var curTbl = document.getElementById(tableid);
 var oXL = new ActiveXObject("Excel.Application");
 var oWB = oXL.Workbooks.Add();
 var oSheet = oWB.ActiveSheet;
 var Lenr = curTbl.rows.length;
 for (i = 0; i < Lenr; i++)
 { var Lenc = curTbl.rows(i).cells.length;
 for (j = 0; j < Lenc; j++)
 {
 oSheet.Cells(i + 1, j + 1).value = curTbl.rows(i).cells(j).innerText;
 }
 }
 oXL.Visible = true;
 }
 //第三種方法
 function getXlsFromTbl(inTblId, inWindow){
 try {
 var allStr = "";
 var curStr = "";
 if (inTblId != null && inTblId != "" && inTblId != "null") {
 curStr = getTblData(inTblId, inWindow);
 }
 if (curStr != null) {
 allStr += curStr;
 }
 else {
 alert("你要導出的表不存在");
 return;
 }
 var fileName = getExcelFileName();
 doFileExport(fileName, allStr);
 }
 catch(e) {
 alert("導出發生異常:" + e.name + "->" + e.description + "!");
 }
 }
 function getTblData(inTbl, inWindow) {
 var rows = 0;
 var tblDocument = document;
 if (!!inWindow && inWindow != "") {
 if (!document.all(inWindow)) {
 return null;
 }
 else {
 tblDocument = eval(inWindow).document;
 }
 }
 var curTbl = tblDocument.getElementById(inTbl);
 var outStr = "";
 if (curTbl != null) {
 for (var j = 0; j < curTbl.rows.length; j++) {
 for (var i = 0; i < curTbl.rows[j].cells.length; i++) {
 if (i == 0 && rows > 0) {
 outStr += " t";
 rows -= 1;
 }
 outStr += curTbl.rows[j].cells[i].innerText + "t";
 if (curTbl.rows[j].cells[i].colSpan > 1) {
 for (var k = 0; k < curTbl.rows[j].cells[i].colSpan - 1; k++) {
 outStr += " t";
 }
 }
 if (i == 0) {
 if (rows == 0 && curTbl.rows[j].cells[i].rowSpan > 1) {
 rows = curTbl.rows[j].cells[i].rowSpan - 1;
 }
 }
 }
 outStr += "rn";
 }
 }
 else {
 outStr = null;
 alert(inTbl + "不存在 !");
 }
 return outStr;
 }
 function getExcelFileName() {
 var d = new Date();
 var curYear = d.getYear();
 var curMonth = "" + (d.getMonth() + 1);
 var curDate = "" + d.getDate();
 var curHour = "" + d.getHours();
 var curMinute = "" + d.getMinutes();
 var curSecond = "" + d.getSeconds();
 if (curMonth.length == 1) {
 curMonth = "0" + curMonth;
 }
 if (curDate.length == 1) {
 curDate = "0" + curDate;
 }
 if (curHour.length == 1) {
 curHour = "0" + curHour;
 }
 if (curMinute.length == 1) {
 curMinute = "0" + curMinute;
 }
 if (curSecond.length == 1) {
 curSecond = "0" + curSecond;
 }
 var fileName = "table" + "_" + curYear + curMonth + curDate + "_"
 + curHour + curMinute + curSecond + ".csv";
 return fileName;
 }
 function doFileExport(inName, inStr) {
 var xlsWin = null;
 if (!!document.all("glbHideFrm")) {
 xlsWin = glbHideFrm;
 }
 else {
 var width = 6;
 var height = 4;
 var openPara = "left=" + (window.screen.width / 2 - width / 2)
 + ",top=" + (window.screen.height / 2 - height / 2)
 + ",scrollbars=no,width=" + width + ",height=" + height;
 xlsWin = window.open("", "_blank", openPara);
 }
 xlsWin.document.write(inStr);
 xlsWin.document.close();
 xlsWin.document.execCommand('Saveas', true, inName);
 xlsWin.close();
 }
 //第四種
 function method4(tableid){
 var curTbl = document.getElementById(tableid);
 var oXL;
 try{
 oXL = new ActiveXObject("Excel.Application"); //創建AX對象excel
 }catch(e){
 alert("無法啟動Excel!\n\n如果您確信您的電腦中已經安裝了Excel，"+"那么請調整IE的安全級別。\n\n具體操作：\n\n"+"工具 → Internet選項 → 安全 → 自定義級別 → 對沒有標記為安全的ActiveX進行初始化和腳本運行 → 啟用");
 return false;
 }
 var oWB = oXL.Workbooks.Add(); //獲取workbook對象
 var oSheet = oWB.ActiveSheet;//激活當前sheet
 var sel = document.body.createTextRange();
 sel.moveToElementText(curTbl); //把表格中的內容移到TextRange中
 sel.select(); //全選TextRange中內容
 sel.execCommand("Copy");//復制TextRange中內容
 oSheet.Paste();//粘貼到活動的EXCEL中
 oXL.Visible = true; //設置excel可見屬性
 var fname = oXL.Application.GetSaveAsFilename("將table導出到excel.xls", "Excel Spreadsheets (*.xls), *.xls");
 oWB.SaveAs(fname);
 oWB.Close();
 oXL.Quit();
 }
 //第五種方法
 var idTmr;
 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';
 }
 }
 function method5(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,',
 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>
</head>
<body>
<p >
 <button type="button" onclick="method1('tableExcel')">導出Excel方法一</button>
 <button type="button" onclick="method2('tableExcel')">導出Excel方法二</button>
 <button type="button" onclick="getXlsFromTbl('tableExcel','myp')">導出Excel方法三</button>
 <button type="button" onclick="method4('tableExcel')">導出Excel方法四</button>
 <button type="button" onclick="method5('tableExcel')">導出Excel方法五</button>
</p>
<p id="myp">
<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>
</p>
</body>
</html>

今天上來發現，好多人，會遇到文件名，格式等問題。這里添加一種方法。兼容性我沒有測試，大家可以試下，不過需要利用JQ直接貼代碼了。源代碼可點擊此處本站下載。注意一定要引jquery-3.2.1.min.js，jquery.table2excel.js對應的文件。jquery-3.2.1.min.js這個看你對應的文件版本，不重要。如有問題，歡迎批評指導。

<!DOCTYPE html>
<html>
<head lang="en">
 <meta charset="UTF-8">
 <title>html 表格導出道</title>
 <script src="js/vendor/jquery-3.2.1.min.js"></script>
 <script src="jquery.table2excel.js"></script>
 <script language="JavaScript" type="text/javascript">
 $(document).ready(function () {
 $("#btnExport").click(function () {
 $("#tableExcel").table2excel({
 exclude : ".noExl", //過濾位置的 css 類名
 filename : "你想說啥" + new Date().getTime() + ".xls", //文件名稱
 name: "Excel Document Name.xlsx",
 exclude_img: true,
 exclude_links: true,
 exclude_inputs: true
 });
 });
 });
 </script>
</head>
<body>
<p >
 <button type="button" id="btnExport" onclick="method5('tableExcel')">導出Excel</button>
</p>
<p id="myp">
 <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>
</p>
</body>
</html>

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

五種JS導出Excel的方法

推薦度：

點擊下載本文 文檔為doc格式

標簽：方法五種種方法

熱門焦點

五種JS導出Excel的方法

五種JS導出Excel的方法

五種JS導出Excel的方法

最新推薦

猜你喜歡

熱門推薦