javascript - 使用 Javascript 将多个 HTML 表格导出到单个 Excel 文件 (xls)

标签 javascript html excel html-table export-to-excel

我正在尝试将多个 html 表格导出到单个文件 excel (xls) 应该是这样
Thanks Credit : How do I export multiple html tables to excel?

HTML代码

<html>
<head>
    <title>JS to Excel</title>

</head>
<body>
    <table id="1">
        <tr><td>Hi</td></tr>
        <tr><td>Hey</td></tr>
        <tr><td>Hello</td></tr>
    </table>
    <table id="2">
        <tr><td>Night</td></tr>
        <tr><td>Evening</td></tr>
        <tr><td>Nite</td></tr>
    </table>

    <a id="dlink"  style="display:none;"></a>
    <input type="button" onclick="tablesToExcel(['1', '2'], ['first', 'second'], 'myfile.xls')" value="Export to Excel">
    <script src="~/Views/JS/JSExcel.js" type="text/javascript"></script>
</body>

像这样的 Javascript

    var tablesToExcel = (function () {
    var uri = 'data:application/vnd.ms-excel;base64,'
    , 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>'
    , templateend = '</x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head>'
    , body = '<body>'
    , tablevar = '<table>{table'
    , tablevarend = '}</table>'
    , bodyend = '</body></html>'
    , worksheet = '<x:ExcelWorksheet><x:Name>'
    , worksheetend = '</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet>'
    , worksheetvar = '{worksheet'
    , worksheetvarend = '}'
    , base64 = function (s) { return window.btoa(unescape(encodeURIComponent(s))) }
    , format = function (s, c) { return s.replace(/{(\w+)}/g, function (m, p) { return c[p]; }) }
    , wstemplate = ''
    , tabletemplate = '';

    return function (table, name, filename) {
        var tables = table;

        for (var i = 0; i < tables.length; ++i) {
            wstemplate += worksheet + worksheetvar + i + worksheetvarend + worksheetend;
            tabletemplate += tablevar + i + tablevarend;
        }

        var allTemplate = template + wstemplate + templateend;
        var allWorksheet = body + tabletemplate + bodyend;
        var allOfIt = allTemplate + allWorksheet;

        var ctx = {};
        for (var j = 0; j < tables.length; ++j) {
            ctx['worksheet' + j] = name[j];
        }

        for (var k = 0; k < tables.length; ++k) {
            var exceltable;
            if (!tables[k].nodeType) exceltable = document.getElementById(tables[k]);
            ctx['table' + k] = exceltable.innerHTML;
        }

        //document.getElementById("dlink").href = uri + base64(format(template, ctx));
        //document.getElementById("dlink").download = filename;
        //document.getElementById("dlink").click();

        window.location.href = uri + base64(format(allOfIt, ctx));

    }
})();

它在一个 excel 文件 (xls) 中处理 2 个表
我的问题是,如果我有 1000 个表怎么办? 我如何使用 DO 或 for 循环来解决我的问题?
我是一名学生,是编程新手,谢谢

最佳答案

终于在 friend 的帮助下完成了:)
HTML

<html>
<head>
    <title>JS to Excel</title>

</head>
<body>
    <table id="1">
        <tr><td>Hi</td></tr>
        <tr><td>Hey</td></tr>
        <tr><td>Hello</td></tr>
    </table>
    <table id="2">
        <tr><td>Night</td></tr>
        <tr><td>Evening</td></tr>
        <tr><td>Nite</td></tr>
    </table>

    <a id="dlink"  style="display:none;"></a>
<input type="button" onclick="tablesToExcel(array1, array2, 'myfile.xls')" value="Export to Excel">
    <script src="~/Views/JS/JSExcel.js" type="text/javascript"></script>
</body>

Javascript

var array1 = new Array();
    var array2 = new Array();
    var n = 2; //Total table
    for ( var x=1; x<=n; x++ ) {
        array1[x-1] = x;
        array2[x-1] = x + 'th';
    }

    var tablesToExcel = (function () {
        var uri = 'data:application/vnd.ms-excel;base64,'
        , 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>'
        , templateend = '</x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head>'
        , body = '<body>'
        , tablevar = '<table>{table'
        , tablevarend = '}</table>'
        , bodyend = '</body></html>'
        , worksheet = '<x:ExcelWorksheet><x:Name>'
        , worksheetend = '</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet>'
        , worksheetvar = '{worksheet'
        , worksheetvarend = '}'
        , base64 = function (s) { return window.btoa(unescape(encodeURIComponent(s))) }
        , format = function (s, c) { return s.replace(/{(\w+)}/g, function (m, p) { return c[p]; }) }
        , wstemplate = ''
        , tabletemplate = '';

        return function (table, name, filename) {
            var tables = table;

            for (var i = 0; i < tables.length; ++i) {
                wstemplate += worksheet + worksheetvar + i + worksheetvarend + worksheetend;
                tabletemplate += tablevar + i + tablevarend;
            }

            var allTemplate = template + wstemplate + templateend;
            var allWorksheet = body + tabletemplate + bodyend;
            var allOfIt = allTemplate + allWorksheet;

            var ctx = {};
            for (var j = 0; j < tables.length; ++j) {
                ctx['worksheet' + j] = name[j];
            }

            for (var k = 0; k < tables.length; ++k) {
                var exceltable;
                if (!tables[k].nodeType) exceltable = document.getElementById(tables[k]);
                ctx['table' + k] = exceltable.innerHTML;
            }

            //document.getElementById("dlink").href = uri + base64(format(template, ctx));
            //document.getElementById("dlink").download = filename;
            //document.getElementById("dlink").click();

            window.location.href = uri + base64(format(allOfIt, ctx));

        }
    })();

关于javascript - 使用 Javascript 将多个 HTML 表格导出到单个 Excel 文件 (xls),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38690070/

相关文章:

JavaScript 内存泄漏 - DOM 节点和后代上的垃圾收集

javascript - Reactjs 没有在子进程中调用 onChange 回调

jquery - Primefaces + jQuery + 三角形图标(不显示)!

html - 代码在 F8 单步执行期间有效,但在正常运行时无效

python - 使用Python从文件夹中按顺序读取多个excel文件

javascript - 在 Chrome 扩展中绕过 X-Frame-Options DENY?

c# - 文件上传html5 asp.net web方法

php - 移动网站的 HTML 压缩

html - 尝试在表格下对齐图像时出现问题

vba - 如何使用空白单元格作为引用来执行 sumif?