美文网首页程序员
HTML TABLE拷贝到剪贴板,导出到EXCEL

HTML TABLE拷贝到剪贴板,导出到EXCEL

作者: 白龙马5217 | 来源:发表于2020-08-13 17:58 被阅读0次

    1 拷贝到剪贴板

    <script type="text/javascript">
        function selectElementContents(el) {
            var body = document.body, range, sel;
            if (document.createRange && window.getSelection) {
                range = document.createRange();
                sel = window.getSelection();
                sel.removeAllRanges();
                try {
                    range.selectNodeContents(el);
                    sel.addRange(range);
                } catch (e) {
                    range.selectNode(el);
                    sel.addRange(range);
                }
                document.execCommand("copy");
    
            } else if (body.createTextRange) {
                range = body.createTextRange();
                range.moveToElementText(el);
                range.select();
                range.execCommand("Copy");
            }
        }
    </script>
    
    <table class="table tableStyles" id="tables" border="1">
            <caption>白股精</caption><!--可以生成表格的标题-->
            <thead>
                <tr>
            <th>财季</th>
                    <th>代码</th>
                    <th>名称</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>202006</td>
                    <td>002353</td>
                    <td>杰瑞股份</td>
                </tr>
                <tr>
                    <td>202006</td>
                    <td>603613</td>
                    <td>国联股份</td>
                </tr>
                <tr>
                    <td>202006</td>
                    <td>600745</td>
                    <td>闻泰科技</td>
                </tr>
                <tr>
                    <td>202006</td>
                    <td>600346</td>
                    <td>恒力石化</td>
                </tr>
               <tr>
                    <td>202006</td>
                    <td>002847</td>
                    <td>盐津铺子</td>
                </tr>
            </tbody>
        </table>
    <hr/>
    <input type="button" value="Copy to Clipboard"
       onclick="selectElementContents( document.getElementById('tables') );">
    

    2导出到EXCEL,IE不支持

     <script type="text/javascript">
            var tableToExcel = (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, filename) {
                    if (!table.nodeType) table = document.getElementById(table)
                    var ctx = { worksheet: name || 'Worksheet', table: table.innerHTML }
        
                    document.getElementById("dlink").href = uri + base64(format(template, ctx));
                    document.getElementById("dlink").download = filename;
                    document.getElementById("dlink").click();
                }
            })()
        </script>
    
    
    <table class="table tableStyles" id="tables" border="1">
            <caption>白股精</caption><!--可以生成表格的标题-->
            <thead>
                <tr>
            <th>财季</th>
                    <th>代码</th>
                    <th>名称</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>202006</td>
                    <td>002353</td>
                    <td>杰瑞股份</td>
                </tr>
                <tr>
                    <td>202006</td>
                    <td>603613</td>
                    <td>国联股份</td>
                </tr>
                <tr>
                    <td>202006</td>
                    <td>600745</td>
                    <td>闻泰科技</td>
                </tr>
                <tr>
                    <td>202006</td>
                    <td>600346</td>
                    <td>恒力石化</td>
                </tr>
               <tr>
                    <td>202006</td>
                    <td>002847</td>
                    <td>盐津铺子</td>
                </tr>
            </tbody>
        </table>
    <hr/>
    <a id="dlink"  style="display:none;"></a>
    <input type="button" onclick="tableToExcel('tables', 'name', 'myfile.xls')" value="Export to Excel">
    
    

    3拷贝到剪贴板和导出到EXCEL二合一

     <script type="text/javascript">
            var tableToExcel = (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:Excel
    
    Worksheet></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, filename) {
                    if (!table.nodeType) table = document.getElementById(table)
                    var ctx = { worksheet: name || 'Worksheet', table: 
    
    table.innerHTML }
        
                    document.getElementById("dlink").href = uri + base64(format
    
    (template, ctx));
                    document.getElementById("dlink").download = filename;
                    document.getElementById("dlink").click();
                }
            })()
        </script>
    
    <script type="text/javascript">
        function selectElementContents(el) {
            var body = document.body, range, sel;
            if (document.createRange && window.getSelection) {
                range = document.createRange();
                sel = window.getSelection();
                sel.removeAllRanges();
                try {
                    range.selectNodeContents(el);
                    sel.addRange(range);
                } catch (e) {
                    range.selectNode(el);
                    sel.addRange(range);
                }
                document.execCommand("copy");
    
            } else if (body.createTextRange) {
                range = body.createTextRange();
                range.moveToElementText(el);
                range.select();
                range.execCommand("Copy");
            }
        }
    </script>
    
    <input type="button" value="Copy to Clipboard"
       onclick="selectElementContents( document.getElementById('tables') );">
    
    <hr/>
    
    <table class="table tableStyles" id="tables" border="1">
            <caption>白股精</caption><!--可以生成表格的标题-->
            <thead>
                <tr>
            <th>财季</th>
                    <th>代码</th>
                    <th>名称</th>                
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>202006</td>
                    <td>002353</td>
                    <td>杰瑞股份</td>              
                </tr>
                <tr>
                    <td>202006</td>
                    <td>603613</td>
                    <td>国联股份</td>
                </tr>
                <tr>
                    <td>202006</td>
                    <td>600745</td>
                    <td>闻泰科技</td>              
                </tr>
                <tr>     
                    <td>202006</td>
                    <td>600346</td>
                    <td>恒力石化</td>
                </tr>
            <tr>
                    <td>202006</td>
                    <td>002847</td>
                    <td>盐津铺子</td>               
                </tr>
            </tbody>
        </table>
    <hr/>
    <a id="dlink"  style="display:none;"></a>
    <input type="button" onclick="tableToExcel('tables', 'name', 'myfile.xls')" 
    
    value="Export to Excel">
    
    

    相关文章

      网友评论

        本文标题:HTML TABLE拷贝到剪贴板,导出到EXCEL

        本文链接:https://www.haomeiwen.com/subject/imridktx.html