将页面上的多个 html 表格保存为 CSV
Posted
技术标签:
【中文标题】将页面上的多个 html 表格保存为 CSV【英文标题】：Save multiple html tables on a page as CSV 【发布时间】：2019-06-13 19:12:54 【问题描述】：我有一个页面，上面有多个 html 表。我想使用 JS 或 JQuery 将所有表格下载到一个 CSV 或 Excel 文件中。我搜索了它并找到了一些 jQuery 插件
https://www.jqueryscript.net/table/Table-To-CSV-jQuery-csvExport.html
但问题是它们仅适用于页面上的一个表格。我想将页面上的所有表格保存在一张 Excel 表中。有没有人能够将一个页面上的多个 html 表格导出到一个也可以在 IE 中使用的 excel 文件中。
谢谢
【问题讨论】：
jsfiddle.net/bxq4Lz18 非常好..可以在表格之间添加一个空格并保留html样式。 我尝试了代码，它对我来说很好，但是它在 IE11 中不起作用..IE11 有什么解决方法吗？ 我也尝试了其他 IE 版本，但似乎在那里不起作用。 我将您的回答与***.com/questions/24007073/… 结合起来，使其也可以在 IE 中加载。感谢您的帮助。 【参考方案1】：看起来我们需要为 Edge/IE 使用 BLOB（基于this related answer）。试一试。我在 Edge 中对其进行了测试，它似乎可以工作。
注意：您将无法单击下面 sn-p 中的“导出”按钮，因为代码处于沙盒环境中。我在这里创建了一个小提琴供您测试：https://jsfiddle.net/ratk2pmz/
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)
if (!table.nodeType)
table = document.getElementById(table)
var ctx =
worksheet: name || 'Worksheet',
table: table.innerHTML
var HeaderName = 'Download-ExcelFile';
var ua = window.navigator.userAgent;
var msieEdge = ua.indexOf("Edge");
var msie = ua.indexOf("MSIE ");
if (msieEdge > 0 || msie > 0)
if (window.navigator.msSaveBlob)
var dataContent = new Blob([base64(format(template, ctx))],
type: "application/csv;charset=utf-8;"
);
var fileName = "excel.xls";
navigator.msSaveBlob(dataContent, fileName);
return;
window.open('data:application/vnd.ms-excel,' + encodeURIComponent(format(template, ctx)));
)()<table id="table">
<tr>
<th>Company</th>
<th>Contact</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Maria Anders</td>
<td>Germany</td>
</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Francisco Chang</td>
<td>Mexico</td>
</tr>
<tr>
<td>Ernst Handel</td>
<td>Roland Mendel</td>
<td>Austria</td>
</tr>
<tr>
<td>Island Trading</td>
<td>Helen Bennett</td>
<td>UK</td>
</tr>
<tr>
<td>Laughing Bacchus Winecellars</td>
<td>Yoshi Tannamuri</td>
<td>Canada</td>
</tr>
<tr>
<td>Magazzini Alimentari Riuniti</td>
<td>Giovanni Rovelli</td>
<td>Italy</td>
</tr>
</table>
<button onclick="tableToExcel('table', 'SHEET1')" class="btn btn-primary">Export to Excel</button>【讨论】：
您将无法单击 sn-p 中的“导出”按钮，因为代码处于沙盒环境中。我在这里创建了一个小提琴供您测试：jsfiddle.net/ratk2pmz 没问题。如果我的回答对您有帮助，请随时点赞或接受。如果我能提供任何其他帮助，请告诉我。祝你好运！ :-)以上是关于将页面上的多个 html 表格保存为 CSV的主要内容，如果未能解决你的问题，请参考以下文章