我想创建一个excel文件( .xlsx 格式),并使用客户端JavaScript 进行下载。我能够使用 js-xlsx 库创建示例文件。但是我无法对其应用任何样式。至少需要一些基本样式,包括:标题的背景颜色,标题的粗体字体和单元格的文本包装。
js-xlsx 库文档说,我们可以使用Cell Object给出样式。
我尝试使用单元格对象提供样式,但它未反射(reflect)在下载的.xlsx文件中。我什至尝试使用 XLSX.write()函数读取.xlsx文件并将其写回。但是它会返回一个完全没有样式的excel文件。理想情况下,我希望下载的文件具有与上传文件相同的样式。在重新创建的文件中未应用字体颜色或背景色。我使用 Excel 2013 来测试下载的文件。
上传前后请在下面的excel屏幕截图中找到。
原始文件
下载文件
代码如下。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<script type="text/javascript" src="xlsx.core.min.js"></script>
<script type="text/javascript" src="Blob.js"></script>
<script type="text/javascript" src="FileSaver.js"></script>
<script>
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;
}
/* set up XMLHttpRequest */
var url = "template-sample.xlsx";
var oReq = new XMLHttpRequest();
oReq.open("GET", url, true);
oReq.responseType = "arraybuffer";
oReq.onload = function(e) {
var arraybuffer = oReq.response;
/* convert data to binary string */
var data = new Uint8Array(arraybuffer);
var arr = new Array();
for(var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);
var bstr = arr.join("");
/* Call XLSX */
var workbook = XLSX.read(bstr, {type:"binary", cellStyles:true});
console.log("read workbook");
console.log(workbook);
/* DO SOMETHING WITH workbook HERE */
var wbout = XLSX.write(workbook, {bookType:'xlsx', bookSST:true, type: 'binary', cellStyles: true});
saveAs(new Blob([s2ab(wbout)],{type:"application/octet-stream"}), "template-download.xlsx");
}
function read(){
oReq.send();
}
</script>
</head>
<body>
<button onclick="read()">save xlsx</button>
</body></html>
示例代码来自here。
我期待的是使用 js-xlsx 库为单元格提供样式的选项,或提供此功能的另一个库。我找到了一个名为exceljs的库,但是它需要节点js 来支持它。我正在寻找一个纯粹基于客户端的解决方案。这将用于基于 Cordova 的平板电脑和台式机应用程序。
最佳答案
经过一些研究,我能够找到自己的问题的解决方案。
我发现了一个名为xlsx-style的新库来提供样式。 xlsx样式是在 js-xlsx 的基础上构建的,还可以为生成的excel文件提供样式。可以使用单元格对象内的新属性将样式赋予单元格。
可以在npm xlsx-style页面上获得说明。
使用与每个单元格关联的样式对象来指定样式。字体,颜色,对齐方式等可以使用此样式对象指定。
我在github page中添加了一个极简演示。
可在github repository上获得示例代码。
您可以在下面找到生成的excel页面的屏幕截图。