JSを使ってExcelにエクスポートする5つの方法を詳しく解説-jsチュートリアル-php.cn

ホームページ

ウェブフロントエンド

jsチュートリアル

JSを使ってExcelにエクスポートする5つの方法を詳しく解説

亚连

May 30, 2018 am 10:04 AM

excel javascript 輸出

この記事では、主に JS を使用して Excel をエクスポートする 5 つの方法を紹介し、例の形式で Excel ファイルをエクスポートするための関連操作テクニックを詳細に分析します。読者がダウンロードして参照できるように、ソースコードも添付されています。必要な方は参照してください

この記事の例では、JS を使用して Excel をエクスポートする 5 つの方法について説明します。参考までに皆さんと共有してください。詳細は次のとおりです:

これら 5 つの方法のうち、最初の 4 つの方法は IE ブラウザのみをサポートし、最後の方法は現在の主流のブラウザ (Firefox、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(&#39;Saveas&#39;, 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 &#39;ie&#39;;
      }
      //firefox
      else if (explorer.indexOf("Firefox") >= 0) {
        return &#39;Firefox&#39;;
      }
      //Chrome
      else if(explorer.indexOf("Chrome") >= 0){
        return &#39;Chrome&#39;;
      }
      //Opera
      else if(explorer.indexOf("Opera") >= 0){
        return &#39;Opera&#39;;
      }
      //Safari
      else if(explorer.indexOf("Safari") >= 0){
        return &#39;Safari&#39;;
      }
    }
    function method5(tableid) {
      if(getExplorer()==&#39;ie&#39;)
      {
        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 = &#39;data:application/vnd.ms-excel;base64,&#39;,
          template = &#39;<html><head><meta charset="UTF-8"></head><body><table>{table}</table></body></html>&#39;,
          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 || &#39;Worksheet&#39;, table: table.innerHTML}
        window.location.href = uri + base64(format(template, ctx))
      }
    })()
  </script>
</head>
<body>
<p >
  <button type="button" onclick="method1(&#39;tableExcel&#39;)">导出Excel方法一</button>
  <button type="button" onclick="method2(&#39;tableExcel&#39;)">导出Excel方法二</button>
  <button type="button" onclick="getXlsFromTbl(&#39;tableExcel&#39;,&#39;myp&#39;)">导出Excel方法三</button>
  <button type="button" onclick="method4(&#39;tableExcel&#39;)">导出Excel方法四</button>
  <button type="button" onclick="method5(&#39;tableExcel&#39;)">导出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 を使用する必要があります。ソースコードは、ここをクリックしてこの Web サイトからダウンロードできます。 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(&#39;tableExcel&#39;)">导出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>

ログイン後にコピー

以上は皆さんのためにまとめたもので、今後皆さんのお役に立てれば幸いです。

Vue.jsプロジェクトAPIの詳細解説、ルーター構成の分割実践

Vueのアクティブクリック切り替え方式を実装

Vueの携帯電話番号、メール定期認証と認証送信60秒コード例

以上がJSを使ってExcelにエクスポートする5つの方法を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

脱衣画像を無料で

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

神レベルのコード編集ソフト（SublimeText3）

ホットトピック

Gmailメールのログイン入り口はどこですか？

7569

CakePHP チュートリアル

1386

Steamのアカウント名の形式は何ですか

Win11 Activation Key Permanent

NYTの接続はヒントと回答です

107

Related knowledge

Excelで印刷時に枠線が消えてしまった場合はどうすればよいですか？ Mar 21, 2024 am 09:50 AM

印刷が必要なファイルを開いたときに、印刷プレビューで表の枠線が何らかの原因で消えてしまった場合は、早めに対処する必要があります。 file このような質問がある場合は、エディターに参加して次のコースを学習してください: Excel で表を印刷するときに枠線が消えた場合はどうすればよいですか? 1. 次の図に示すように、印刷する必要があるファイルを開きます。 2. 以下の図に示すように、必要なコンテンツ領域をすべて選択します。 3. 以下の図に示すように、マウスを右クリックして「セルの書式設定」オプションを選択します。 4. 以下の図に示すように、ウィンドウの上部にある「境界線」オプションをクリックします。 5. 下図に示すように、左側の線種で細い実線パターンを選択します。 6.「外枠」を選択します

Excelで3つ以上のキーワードを同時にフィルタリングする方法 Mar 21, 2024 pm 03:16 PM

Excelは日々の事務作業でデータ処理に使用されることが多く、「フィルター」機能を使用することが多いです。 Excel で「フィルタリング」を実行する場合、同じ列に対して最大 2 つの条件しかフィルタリングできません。では、Excel で同時に 3 つ以上のキーワードをフィルタリングする方法をご存知ですか?次に、それをデモンストレーションしてみましょう。 1 つ目の方法は、フィルターに条件を徐々に追加することです。条件を満たす 3 つの詳細を同時にフィルターで除外する場合は、まずそのうちの 1 つを段階的にフィルターで除外する必要があります。最初に、条件に基づいて姓が「Wang」の従業員をフィルタリングできます。 [OK]をクリックし、フィルター結果の[現在の選択をフィルターに追加]にチェックを入れます。手順は以下の通りです。同様に再度個別にフィルタリングを行う

Excelテーブル互換モードを通常モードに変更する方法 Mar 20, 2024 pm 08:01 PM

私たちは日々の仕事や勉強で、他人からExcelファイルをコピーし、そのファイルを開いて内容を追加したり、再編集したりして保存することがありますが、互換性チェックのダイアログボックスが表示されることがあり、非常に面倒です。ソフトウェア. 、通常モードに変更できますか？そこで以下では、エディターがこの問題を解決するための詳細な手順を紹介します。一緒に学びましょう。最後に、忘れずに保存してください。 1. 図に示すように、ワークシートを開き、ワークシートの名前に追加の互換モードを表示します。 2. このワークシートでは、内容を変更して保存すると、図のように互換性チェックのダイアログが必ず表示され、非常に面倒です。 3. [Office] ボタンをクリックし、[名前を付けて保存] をクリックして、

Excelで上付き文字を設定する方法 Mar 20, 2024 pm 04:30 PM

データを処理していると、倍数や温度などのさまざまな記号が含まれるデータに遭遇することがあります。 Excel で上付き文字を設定する方法をご存知ですか? Excel を使用してデータを処理する場合、上付き文字を設定しないと、大量のデータを入力するのがさらに面倒になります。今回はエクセルの上付き文字の具体的な設定方法をエディターがお届けします。 1. まず、図に示すように、デスクトップで Microsoft Office Excel ドキュメントを開き、上付き文字に変更する必要があるテキストを選択します。 2. 次に、図に示すように、右クリックして、クリック後に表示されるメニューで「セルの書式設定」オプションを選択します。 3. 次に、自動的に表示される「セルの書式設定」ダイアログボックスで

エクセルでiif関数を使う方法 Mar 20, 2024 pm 06:10 PM

ほとんどのユーザーは Excel を使用してテーブルデータを処理します。実は Excel にも VBA プログラムがあります。専門家を除けば、この関数を使用したユーザーはあまり多くありません。VBA で記述するときによく使用されるのが iif 関数です。実際には、次の場合と同じです。関数の機能は似ていますが、iif関数の使い方を紹介します。 SQL ステートメントには iif 関数があり、Excel には VBA コードがあります。 iif 関数は Excel ワークシートの IF 関数と似ており、論理的に計算された真値と偽値に基づいて真偽値を判定し、異なる結果を返します。 IF 関数の使用法は (条件、はい、いいえ) です。 VBAのIF文とIIF関数、前者のIF文は条件に応じて異なる文を実行できる制御文であり、後者は条件に応じて異なる文を実行できる制御文です。

Excelの読み取りモードを設定する場所 Mar 21, 2024 am 08:40 AM

ソフトウェアの学習では、Excel が便利なだけでなく、実際の作業で必要なさまざまな形式に対応できるため、Excel の使用に慣れています。Excel は非常に柔軟に使用でき、今日は「みんなのために：Excelの読み取りモードを設定する場所」を持ってきました。 1. コンピュータの電源を入れ、Excel アプリケーションを開き、目的のデータを見つけます。 2. Excel で読み取りモードを設定するには 2 つの方法があります。 1 つ目: Excel には、Excel レイアウトで多数の便利な処理メソッドが配布されています。 Excelの右下に読み取りモードを設定するショートカットがあります。バツマークのパターンを見つけてクリックすると、読み取りモードに入ります。バツマークの右側に小さな立体マークがあります。。

ExcelアイコンをPPTスライドに挿入する方法 Mar 26, 2024 pm 05:40 PM

1. PPT を開き、Excel アイコンを挿入する必要があるページに移動します。「挿入」タブをクリックします。 2. ［オブジェクト］をクリックします。 3. 次のダイアログボックスが表示されます。 4. [ファイルから作成]をクリックし、[参照]をクリックします。 5. 挿入する Excel テーブルを選択します。 6. [OK] をクリックすると、次のページが表示されます。 7. [アイコンで表示]にチェックを入れます。 8. 「OK」をクリックします。

WeChat で Douyin プライベートメッセージの絵文字を取得するにはどうすればよいですか?プライベートメッセージの絵文字パッケージをエクスポートするにはどうすればよいですか? Mar 21, 2024 pm 10:01 PM

ソーシャルメディアの台頭が続く中、Douyinは人気のショートビデオプラットフォームとして多くのユーザーを魅了しています。 Douyin では、ユーザーは自分の生活を公開するだけでなく、他のユーザーと交流することもできます。このインタラクションにおいて、絵文字は徐々にユーザーが感情を表現する重要な手段になってきました。 1. WeChat で Douyin プライベートメッセージ絵文字を取得するにはどうすればよいですか?まず、Douyin プラットフォームでプライベートメッセージ絵文字を取得するには、Douyin アカウントにログインし、気に入った絵文字を参照して選択する必要があります。友達に送信するか、自分で収集するかを選択できます。 Douyin で絵文字パッケージを受信した後、プライベートメッセージインターフェイスで絵文字パッケージを長押しし、「絵文字に追加」機能を選択できます。このようにして、この顔文字パッケージをDouyinの顔文字ライブラリに追加できます。 3. 次に、Douyin 顔文字ライブラリに単語を追加する必要があります

See all articles