栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

如何将HTML表格导出到具有不同工作表的单个Excel工作簿中?

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

如何将HTML表格导出到具有不同工作表的单个Excel工作簿中?

您可以使用SheetJS创建具有多个工作表并具有格式(包括colspan和rowspan)的Excel工作簿。这是讨论线程和该线程中发布的示例:

我已将reviewher的示例代码从JSFiddle移到Stack
Overflow,以方便查看。运行代码段,然后单击生成的Excel链接以下载包含两页的Excel文件。

    function prepareTable(i) {        var str = "", header = "", graphImg;        header = '<html><h2 >Google' + i + '</h2>';        str = '<table border="1">' +'<tr><td  colspan="6">Yahoo' + i + '</td></tr>'          +'<tr><td  colspan="6">(2017.03.20)</td></tr>' +'<thead>' +'    <tr >' +'      <th scope="col" rowspan="2">' +'        <div>Yahoo</div>' +'      </th>' +'      <th scope="col">' +'        <div >Yahoo(2017-01)</div>' +'      </th>' +'      <th scope="col" colspan="2">' +'        <div >Yahoo(2016-12)</div>' +'      </th>' +'      <th scope="col" colspan="2">' +'        <div >Yahoo(2016-12)</div>' +'      </th>' +'    </tr>' +'    <tr >' +'      <th height="40" align="right">' +'        <div>Yahoo</div>' +'      </th>' +'      <th align="right">' +'        <div>Yahoo</div>' +'      </th>' +'      <th align="right">' +'        <div>Yahoo</div>' +'      </th>' +'      <th align="right">' +'        <div>Yahoo</div>' +'      </th>' +'      <th align="right">' +'        <div>Yahoo</div>' +'      </th>' +'    </tr>' +'</thead>' +'  <tbody>'        +'    <tr >'        +'      <td >'        +'        <div>NAME</div>'        +'      </td>'        +'      <td >'        +'        <div>311,210</div>'        +'      </td>'        +'      <td >'        +'        <div>311,210</div>'        +'      </td>'        +'      <td >'        +'        <div>311,210%</div>'        +'      </td>'        +'      <td >'        +'        <div>311,210</div>'        +'      </td>'        +'      <td >'        +'        <div>311,210%</div>'        +'      </td>'        +'    </tr>'        +'  </tbody>'        +'</table></html>'; return header + str;    }    function s2ab(s) { var buf = new ArrayBuffer(s.length); var view = new Uint8Array(buf); for (var i=0; i!=s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF; return buf;    }    function doExcel1 () {        var blob,        wb = {SheetNames:[], Sheets:{}}; var ws1 = XLSX.read(prepareTable(1), {type:"binary"}).Sheets.Sheet1; wb.SheetNames.push("Sheet1"); wb.Sheets["Sheet1"] = ws1; var ws2 = XLSX.read(prepareTable(2), {type:"binary"}).Sheets.Sheet1; wb.SheetNames.push("Sheet2"); wb.Sheets["Sheet2"] = ws2; console.log(ws1); console.log(ws2); console.log(wb); blob = new Blob([s2ab(XLSX.write(wb, {bookType:'xlsx', type:'binary'}))], { type: "application/octet-stream"        });        saveAs(blob, "test.xlsx");    }    <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.10.3/xlsx.full.min.js"></script>    <script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.3/FileSaver.min.js"></script>    <a href="javascript:"  onclick="doExcel1()"><span>Excel</span></a>

2)带有格式的工作表

这是另一个与GitHub线程相同的演示,展示了多个colspan,多个rowpan,背景颜色,字体颜色,字体大小等。该示例来自GitHub上的HeroSony。

如上所述,单击

Run pre snippet
,然后单击结果
Excel
链接以下载Excel文件。

    function prepareTable() {        var str = "", header = "", graphImg;        header = 'uFEFF<h2 >Google</h2>';        str = '<table border="1">' +'<tr><td  colspan="6">Yahoo</td></tr>'          +'<tr><td  colspan="6">(2017.03.20)</td></tr>' +'<thead>' +'    <tr >' +'      <th scope="col" rowspan="2">' +'        <div>Yahoo</div>' +'      </th>' +'      <th scope="col">' +'        <div >Yahoo(2017-01)</div>' +'      </th>' +'      <th scope="col" colspan="2">' +'        <div >Yahoo(2016-12)</div>' +'      </th>' +'      <th scope="col" colspan="2">' +'        <div >Yahoo(2016-12)</div>' +'      </th>' +'    </tr>' +'    <tr >' +'      <th height="40" align="right">' +'        <div>Yahoo</div>' +'      </th>' +'      <th align="right">' +'        <div>Yahoo</div>' +'      </th>' +'      <th align="right">' +'        <div>Yahoo</div>' +'      </th>' +'      <th align="right">' +'        <div>Yahoo</div>' +'      </th>' +'      <th align="right">' +'        <div>Yahoo</div>' +'      </th>' +'    </tr>' +'</thead>' +'  <tbody>'        +'    <tr >'        +'      <td >'        +'        <div>NAME</div>'        +'      </td>'        +'      <td >'        +'        <div>311,210</div>'        +'      </td>'        +'      <td >'        +'        <div>311,210</div>'        +'      </td>'        +'      <td >'        +'        <div>311,210%</div>'        +'      </td>'        +'      <td >'        +'        <div>311,210</div>'        +'      </td>'        +'      <td >'        +'        <div>311,210%</div>'        +'      </td>'        +'    </tr>';        +'  </tbody>'        +'</table>'; return header + str;    }    function doExcel1 () {        var blob, template = prepareTable();        blob = new Blob([template], { type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"        });        saveAs(blob, "test.xls");    }    <script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.3/FileSaver.min.js"></script>    <a href="javascript:"  onclick="doExcel1()"><span>Excel</span></a>


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/421998.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号