• 前端JS脚本将网页表格导出为Excel


    话不多说,上代码!

    <!DOCTYPE>
    <html>
        <head>
            <title>Excel Test</title>
        </head>
        
        <body>
            <div style="100%;padding:40px;">
                Excel Test
            </div>
            <table id="excel">
                <tr>
                    <td>Name</td>
                    <td>Age</td>
                    <td>Gender</td>
                </tr>
                <tr>
                    <td>Young</td>
                    <td>24</td>
                    <td>Male</td>
                </tr>
                <tr>
                    <td>Even</td>
                    <td>23</td>
                    <td>Female</td>
                </tr>
                <tr>
                    <td>Leon</td>
                    <td>25</td>
                    <td>Male</td>
                </tr>
            </table>
        </body>
        <div style="200px;margin:auto;text-align:center;">
            <button onclick="ok()">导出</button>
        </div>
        
        <script>
        var ok = (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><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></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) {
                var tables = document.getElementById('excel');
                var ctx = { worksheet: name || 'Worksheet', table: tables.innerHTML }
                window.location.href = uri + base64(format(template, ctx));
            }
        })();
    
        function ExportSupplierMonthlyData() {
            try {
                tableToExcel();
            } catch (err) {
                bootbox.alert('没有数据,导出失败');
            }
        }
        </script>
    </html>
  • 相关阅读:
    leetcode[9]Palindrome Number
    leetcode[10]Regular Expression Matching
    leetcode[11]Container With Most Water
    leetcode[12]Integer to Roman
    leetcode[13]Roman to Integer
    leetcode[14]Longest Common Prefix
    leetcode[15]3Sum
    leetcode[16]3Sum Closest
    leetcode[17]Letter Combinations of a Phone Number
    leetcode[18]4Sum
  • 原文地址:https://www.cnblogs.com/chenyangsocool/p/7368299.html
Copyright © 2020-2023  润新知