JavaScript を使用して HTML テーブルを Excel にエクスポートする

1. JavaScript で TabletoExcel ライブラリを使用して HTML テーブルを Excel にエクスポートする
2. HTML テーブルを JavaScript で TableExport ライブラリを使用して Excel ファイルにエクスポートする
3. jQuery ライブラリを使用して HTML テーブルをエクスポートし、JavaScript で Excel ファイルを作成する

Excel スプレッドシートは、表形式のデータを 1つ以上のシートに保存するために使用されます。

このチュートリアルでは、JavaScript を使用して HTML テーブルを Excel にエクスポートする方法を学習します。

JavaScript で TabletoExcel ライブラリを使用して HTML テーブルを Excel にエクスポートする

TableToExcel ライブラリを使用して、HTML テーブルを Excel ファイルにエクスポートできます。convert() メソッドを使用して、必要な変換を行います。

以下のコードを参照してください。

<button id="btnExport" onclick="exportReportToExcel(this)">Export HTML Table</button>

<script type="text/javascript">
  function exportReportToExcel() {
    let table = document.getElementsByID("table");
    TableToExcel.convert(table[0], {
      name: `file.xlsx`,
      sheet: {
        name: 'Sheet 1'
      }
    });
  }
</script>

上記の例では、getElementsbyID() 関数を使用して必要なテーブル要素を取得します。これを Excel ファイルにエクスポートします。ファイルの名前とシートも、name および sheet プロパティを使用して提供されました。

HTML テーブルを JavaScript で TableExport ライブラリを使用して Excel ファイルにエクスポートする

TableExport ライブラリは、HTML テーブルを XLSX、XLS、CSV、またはテキストファイルにエクスポートできます。このライブラリは使いやすく、最終的なファイルをカスタマイズするためのさまざまなプロパティを提供します。

以下のコードを確認してください。

<script src="https://cdnjs.cloudflare.com/ajax/libs/TableExport/5.2.0/js/tableexport.min.js" integrity="sha512-XmZS54be9JGMZjf+zk61JZaLZyjTRgs41JLSmx5QlIP5F+sSGIyzD2eJyxD4K6kGGr7AsVhaitzZ2WTfzpsQzg==" crossorigin="anonymous" referrerpolicy="no-referrer">
TableExport(document.getElementsByTagName("table"), {
    filename: 'excelfile',            
    sheetname: "sheet1"                     
});
</script>

上記の例では、getElementsByTagName() 関数を使用して必要な HTML テーブルにアクセスします。filename および sheetname プロパティを使用して、最終的なファイルとシートの名前を設定しました。

TableExport ライブラリを含めるために、HTML コードの script タグにライブラリのソースを追加したことに注意してください。

jQuery ライブラリを使用して HTML テーブルをエクスポートし、JavaScript で Excel ファイルを作成する

table2excel プラグインを使用して、HTML テーブルデータを Excel スプレッドシートにエクスポートします。これは軽量の jQuery プラグインです。

以下のコードを確認してください。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js", type="text/javascript">
  function Export() {
    $("#table").table2excel({
      filename: "file.xls"
    });
  }
</script>

$(table) を使用して必要なテーブルにアクセスしました。table2excel コンストラクターはこれを必要なファイルに変換しました。