關鍵詞:JavaScript, js excel,node excel
1.簡介
js-xlsx 庫是目前 Github 上 star 數量最多的處理 Excel 的庫,功能強大,提供了各種對表格的操作,但是這個項目文檔有些亂,提供的demo也只具備最基本的功能。本文對 js-xlsx 庫進行一定的總結,一是為了自我知識的存檔,二是想和大家多多交流。
Demo地址: http://oss.sheetjs.com/js-xlsx
Github上源碼地址: http://git.io/xlsx
支持解析的格式有:
Excel 2007+ XML Formats (XLSX/XLSM)
Excel 2007+ Binary Format (XLSB)
Excel 2003-2004 XML Format (XML “SpreadsheetML”)
Excel 97-2004 (XLS BIFF8)
Excel 5.0/95 (XLS BIFF5)
OpenDocument Spreadsheet (ODS)
支持輸出格式有:
XLSX
CSV (and general DSV)
JSON and JS objects (various styles)
2.安裝
1.在node環境中,加載xlsx的模塊只包含基本的特性,如果需要用到一些不常見額外特性,得自己安裝。
2.在瀏覽器中,可以添加js引用來使用這些額外的特性。比如:
<script src="dist/cpexcel.js"></script>
<script src="dist/ods.js"></script>
這些額外特性文件都包含在源碼的dist/ directory文件夾里面。在這個文件夾里面,還有xlsx的各種版本核心代碼,完整版,精簡版,壓縮版等。
3.xlsx.js使用了ES5的功能,比如Array和forEach等,為了兼容低版本的瀏覽器,使用了shim技術。在加載xlsx.js文件之前加載shim.js(在dist/ directory文件夾里面),還有xlsx只能解析xls,也就是97-03的excel表格,如果要解析xlsx,也就是03之后的excel表格,需要引入jszip.js文件,而且需要在xlsx之前加載。如下:
<script src="jszip.js"></script>
<script src="shim.js"></script>
<script src="xlsx.js"></script>
名詞解釋:
workbook對象:指的是整份 Excel 文檔。我們在使用 js-xlsx 讀取 Excel 文檔之后就會獲得 workbook 對象。
worksheet 對象:指的是 Excel 文檔中的表。我們知道一份 Excel 文檔中可以包含很多張表,而每張表對應的就是 worksheet 對象。
cell 對象:指的就是 worksheet 中的單元格,一個單元格就是一個 cell 對象。
3.解析表格
接下來會一步步分析怎么解析操作表格。node環境、瀏覽器環境分開講。分析之前,說一下我用於測試的表格。新建一個excel文件,名字叫excel-test。里面有三個表Sheet1、Sheet2、Sheet3,其中Sheet3為空。內容如圖:
1)node環境中
1.安裝xlsx模塊,命令行窗口中輸入:npm install xlsx
2.用 XLSX.readFile 打開 Excel 文件,返回 workbook
代碼:
if(typeof require !== 'undefined') XLSX = require('xlsx');
var workbook = XLSX.readFile('test.xlsx');
首先加載xlsx模塊,然后使用readFile打開excel文件,特別需要注意路徑問題,如果沒有指明路徑,readFile默認打開excel文件的根路徑是你安裝node模塊的位置(電腦里面node_modules文件的位置),而不是你項目源代碼文件的路徑。我的excel文件不在默認的根路徑下,使用相對路徑(注意斜杠方向啊):
var workbook = XLSX.readFile('./Desktop/ExcelParseClient/excel-test.xlsx');
3.用 workbook.SheetNames 獲取表名,代碼:
var sheetNames = workbook.SheetNames;
console.log(sheetNames)打印如圖所示:
4.用 workbook.Sheets[xxx] 通過表名獲取表格,代碼:
var worksheet = workbook.Sheets[sheetNames[i]];
我們來看看worksheet到底是什么?
var worksheet = workbook.Sheets[Sheet1];
console.log(“打印sheet1:\n”,worksheet);如圖:
可以看出,worksheet是一個對象,里面包含名稱/值對,值對的值仍然是對象。要獲取A1單元格的值,這樣:
var desired_cell = worksheet[A1];
var desired_value = desired_cell.v;
5.按自己的需求去處理表格
綜合前面1234步的代碼,代碼為:
if(typeof require !== 'undefined')XLSX=require('xlsx');
var workbook = XLSX.readFile('./Desktop/ExcelParseClient/excel-test.xlsx');
var sheet_name_list = workbook.SheetNames;
/*處理表格*/
sheet_name_list.forEach(function(sheetname) { /* iterate through sheets */
var worksheet = workbook.Sheets[sheetname];
for (z in worksheet) {
/* 帶!的屬性(比如!ref)是表格的特殊屬性,用來輸出表格的信息,不是表格的內容,所以去掉 */
if(z[0] === '!') continue;
console.log(sheetname + ": " + z + "=" + JSON.stringify(worksheet[z].v));
}
});
輸出結果為:
2)瀏覽器環境中
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>JS-XLSX Demo</title>
</head>
<body>
<p><input type="file" name="xlfile" accept="application/vnd.ms-excel,.xlsx,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" id="xlf" />打開Excel文件</p>
<pre id="out"></pre>
<br />
<script src="shim.js"></script>
<script src="jszip.js"></script>
<script src="xlsx.js"></script>
<script> /*this version is the source code that delete all the other code*/ var X = XLSX; var e=e||window.event; var wtf_mode = false; function fixdata(data) { var o = "", l = 0, w = 10240; for(; l<data.byteLength/w; ++l) o+=String.fromCharCode.apply(null,new Uint8Array(data.slice(l*w,l*w+w))); o+=String.fromCharCode.apply(null, new Uint8Array(data.slice(l*w))); return o; } /*transfer the workbook to the json*/ function to_json(workbook) { var result = {}; workbook.SheetNames.forEach(function(sheetName) { var roa = X.utils.sheet_to_row_object_array(workbook.Sheets[sheetName]); if(roa.length > 0){ result[sheetName] = roa; } }); console.log(result); return result; } var xlf = document.getElementById('xlf'); // the "e" means the event(change) // the event.target means the node of the Event,in this programming ,e.target.id equals xlf function handleFile(e) { var files = e.target.files; var f = files[0]; { var reader = new FileReader(); var name = f.name; reader.readAsArrayBuffer(f); //onload means that the function(e) would be executed when the reader has finished the loading reader.onload = function(e) { //return ArrayBuffer{} var data = e.target.result; var arr = fixdata(data); var wb = X.read(btoa(arr), {type: 'base64'}); }; } } if(xlf.addEventListener) xlf.addEventListener('change', handleFile, false); </script>
</body>
</html>
上面node環境中,使用js-xlsx庫的基本操作一步步解析,實際上該庫提供了封裝好的函數一次性解析excel表格成json數據。使用:var roa = X.utils.sheet_to_row_object_array(workbook.Sheets[sheetName]);
關於js-xlsx庫的使用就先分析到這里,下一篇分析怎么用json數據生成excel文件,以及對表格內容進行判斷,比如空格、重復等等。