テーブルを Excel にエクスポートする純粋な JS メソッド

テーブルを Excel にエクスポートする純粋な JS メソッド

html

<div> 要素
    <button type="button" onclick="getXlsFromTbl('tableExcel','myDiv')">IE エクスポート Excel メソッド</button>
    <button type="button" onclick="method5('tableExcel')">Chrome から Excel にエクスポート</button>
</div>
<div id="myDiv">
    <テーブル id="tableExcel" 幅="100%" 境界線="1" セル間隔="0" セルパディング="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>ああ</td>
            <td>bbb</td>
            <td>ccc</td>
            <td>ddd</td>
            <td>えー</td>
        </tr>
        <tr>
            <td>AAA</td>
            <td>BBB</td>
            <td>CCC</td>
            <td>DDD</td>
            <td>ええ</td>
        </tr>
        <tr>
            <td>FFF</td>
            <td>GGG</td>
            <td>はぁ</td>
            <td>III</td>
            <td>ジェイジェイ</td>
        </tr>
    </テーブル>
</div>

js

<スクリプト言語="JavaScript" タイプ="text/javascript">
        //IE メソッド関数 getXlsFromTbl(inTblId, inWindow){

            試す {
                var allStr = "";
                var curStr = "";
                inTblId != null && inTblId != "" && inTblId != "null") {

                    curStr = getTblData(inTblId、inWindow);

                }
                (curStr != null)の場合{
                    allStr + = curStr;
                }

                それ以外 {

                    alert("エクスポートしたいテーブルが存在しません");
                    戻る;
                }
                var ファイル名 = getExcelFileName();
                doFileExport(ファイル名、allStr);

            }

            キャッチ(e) {

                alert("エクスポート例外:" + e.name + "->" + e.description + "!");

            }

        }
        関数 getTblData(inTbl, inWindow) {

            var 行 = 0;
            var tblDocument = ドキュメント;
            if (!!inWindow && inWindow != "") {

                ドキュメントがすべてウィンドウ内にある場合
                    null を返します。
                }

                それ以外 {
                    tblDocument = eval(inWindow).document;
                }

            }

            var curTbl = tblDocument.getElementById(inTbl);
            var outStr = "";
            (curTbl != null) の場合 {
                (var j = 0; j < curTbl.rows.length; j++) の場合 {
                    (var i = 0; i < curTbl.rows[j].cells.length; i++) {

                        i == 0 && 行数 > 0 の場合
                            outStr + = " t";
                            行数 -= 1;
                        }

                        outStr += curTbl.rows[j].cells[i].innerText + "t";
                        (curTbl.rows[j].cells[i].colSpan > 1)の場合{
                            (var k = 0; k < curTbl.rows[j].cells[i].colSpan - 1; k++) {
                                outStr + = " t";
                            }
                        }
                        (i == 0) の場合 {
                            行数 == 0 && curTbl.rows[j].cells[i].rowSpan > 1 の場合 {
                                行 = curTbl.rows[j].cells[i].rowSpan - 1;
                            }
                        }
                    }
                    outStr + = "rn";
                }
            }

            それ以外 {
                outStr = null;
                alert(inTbl + "存在しません!");
            }
            outStr を返します。
        }
        関数 getExcelFileName() {
            var d = 新しい日付();
            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();
            (現在の月の長さ == 1) の場合 {
                現在の月 = "0" + 現在の月;
            }

            (curDate.length == 1)の場合{
                curDate = "0" + curDate;
            }

            (curHour.length == 1)の場合{
                curHour = "0" + curHour;
            }

            (現在の分の長さ == 1) の場合 {
                curMinute = "0" + curMinute;
            }

            (curSecond.length == 1)の場合{
                curSecond = "0" + curSecond;
            }
            var ファイル名 = "table" + "_" + curYear + curMonth + curDate + "_"
                    + curHour + curMinute + curSecond + ".csv";
            ファイル名を返します。

        }
        関数doFileExport(inName, inStr) {
            var xlsWin = null;
            (!!document.all("glbHideFrm"))の場合{
                xlsWin = glbHideFrm;
            }
            それ以外 {
                var 幅 = 6;
                var 高さ = 4;
                var openPara = "left=" + (window.screen.width / 2 - width / 2)
                        + ",top=" + (window.screen.height / 2 - height / 2)
                        + ",スクロールバー=いいえ,幅=" + 幅 + ",高さ=" + 高さ;
                xlsWin = window.open("", "_blank", openPara);
            }
            xlsWin.document.write(inStr);
            xlsWin.document.close();
            xlsWin.document.execCommand('Saveas', true, inName);
            xlsWin.close();

        }

        //Chrome メソッド var idTmr;
        関数 getExplorer() {
            var エクスプローラー = window.navigator.userAgent;
            //つまり  
            (explorer.indexOf("MSIE")> = 0)の場合{
                'ie' を返します。
            }
            //ファイアフォックス  
            そうでない場合 (explorer.indexOf("Firefox") >= 0) {
                'Firefox' を返します。
            }
            //クロム  
            そうでない場合 (explorer.indexOf("Chrome") >= 0) {
                'Chrome' を返します。
            }
            //オペラ  
            そうでない場合 (explorer.indexOf("Opera") >= 0) {
                'Opera' を返します。
            }
            //サファリ  
            そうでない場合 (explorer.indexOf("Safari") >= 0) {
                'Safari' を返します。
            }
        }
        関数メソッド5(テーブルID) {
            getExplorer() = = 'ie'の場合
            {
                var curTbl = document.getElementById(テーブルID);
                var oXL = 新しい ActiveXObject("Excel.Application");
                var oWB = oXL.Workbooks.Add();
                var xlsheet = oWB.ワークシート(1);
                var sel = document.body.createTextRange();
                sel.moveToElementText(curTbl);
                sel.select();
                sel.execCommand("コピー");
                xlsheet.貼り付け();
                oXL.Visible = true;

                試す {
                    var fname = oXL.Application.GetSaveAsFilename("Excel.xls", "Excel スプレッドシート (*.xls), *.xls");
                } キャッチ (e) {
                    print("ネストされた catch がキャッチされました " + e);
                ついに
                    oWB.SaveAs(名前)
                    oWB.Close(変更を保存 = false);
                    XL.Quit();
                    oXL = ヌル;
                    idTmr = window.setInterval("クリーンアップ();", 1);
                }

            }
            それ以外
            {
                tableToExcel(テーブルID)
            }
        }
        関数クリーンアップ() {
            ウィンドウのクリア間隔(idTmr);
            ゴミを収集します();
        }
        var tableToExcel = (関数() {
            var uri = 'data:application/vnd.ms-excel;base64,',
                    テンプレート = '<html><head><meta charset="UTF-8"></head><body><table>{table}</table></body></html>',
                    base64 = 関数 { return window.btoa(unescape(encodeURIComponent(s))) },
                    フォーマット = 関数(s, c) {
                        s.replace(/{(\w+)}/g, を返す
                                関数(m, p) { 戻り値 c[p]; }) }
            関数(テーブル、名前)を返す{
                if (!table.nodeType) テーブル = document.getElementById(テーブル)
                var ctx = {ワークシート: name || 'ワークシート', テーブル: table.innerHTML}
                window.location.href = uri + base64(format(template, ctx))
            }
        })()

    </スクリプト>

これで、純粋な JS を使用してテーブルを Excel にエクスポートする方法に関するこの記事は終了です。JS を使用してテーブルを Excel にエクスポートする方法の詳細については、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • JavaScript を使用して csv ファイル (Excel) をエクスポートする方法の例
  • JS 対応ブラウザ用に Excel (CSV) ファイルをエクスポートする方法
  • テーブルを Excel にエクスポートし、JS に基づいてスタイルを保持する
  • js を使用してデータを EXCEL にエクスポートします (大量のデータのエクスポートをサポートします)
  • JS を使って Excel をエクスポートする 5 つの方法を詳しく解説 [ソースコードのダウンロードあり]
  • jsフロントエンドからExcelをエクスポートする方法
  • JSはExcelとCSVファイルのエクスポートを実装します

<<:  3分でUbuntu 16.04を初期化し、Java、Maven、Docker環境をデプロイする

>>:  画像とテキストでHTTPヘッダーのあらゆる側面を理解する

推薦する

CSS3 border-radius 丸角の実装方法と使い方の詳しい説明

以前は、角を丸くするのは非常に面倒でしたが、CSS3 では、角を丸くするのは非常に簡単になり、bor...

Vue3 でマークダウン エディター コンポーネントを使用する方法

目次インストールコンポーネントのインポート基本的な使い方保存したマークダウンまたは HTML テキス...

シンプルなカルーセル効果を実現するネイティブ js

この記事では、シンプルなカルーセル効果を実現するためのjsの具体的なコードを参考までに紹介します。具...

React スキャフォールディングのパスエイリアスを設定する方法

この記事を書いている時点でのReactのバージョンは16.13.1です1 npm run eject...

Docker を使用して OpenLDAP+phpLDAPadmin 統合ユーザー認証を構築する方法

1. 背景LDAP を使用して、操作および保守に関連するユーザー名とパスワードを集中管理します。 1...

MySQLにおける静的変数の役割の詳細な説明

MySQLにおける静的変数の役割の詳細な説明静的変数の使用 静的変数サンプルコード: 関数テスト()...

HTML のテキストエリア タグ

<textarea></textarea> は、複数行を入力できるテキスト ...

Vue バックグラウンドでステータス ラベルをエレガントに記述する例

目次序文最適化変数の抽出二次包装 el-tag コンポーネント使用要約する序文バックエンドシステムの...

MySQL Routerのインストールと展開

目次01 MySQLルーターの紹介MySQL Router とは何ですか? 02 MySQLルータの...

Linux での MySQL のインストールに関するチュートリアル

目次1. 古いバージョンを削除する2. サーバーのカーネルタイプを確認し、適切なバージョンをダウンロ...

MySQL ルートパスワードを変更する複数の方法 (推奨)

方法1: SET PASSWORDコマンドを使用する MySQL -u ルート mysql> ...

コメント付きのスネークゲームを実装する js

この記事の例では、スネークゲームを実装するためのjsの具体的なコードを参考までに共有しています。具体...

vue3 プロジェクトを素早く構築し、関連機能を紹介する vite+ts の詳細な説明

目次ヴィテ建てる構成vite.config.tsルーターtsタイプvue3 の知識設定小道具コンテク...

Gearman + MySQL による永続化操作例

この記事では、gearman+mysql メソッドを使用して永続化操作を実装します。ご参考までに、詳...

Nginx URL 書き換えメカニズムの原理と使用例

URL 書き換えは、Web サイトの優先ドメインを決定するのに役立ちます。同じリソース ページの複数...