SheetJS 入门案例___及自己的后续研究_一定要看官方材料
来源于 https://www.cnblogs.com/caer/p/7067313.html
<!doctype html>
<html>
<head>
<title>EXCEL转JSON</title>
<meta charset="UTF-8" />
<script type="text/javascript" src="http://mat1.gtimg.com/www/asset/lib/jquery/jquery/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="/xls/js/xls.js"></script>
<script type="text/javascript" src="/xls/js/jszip.js"></script>
<script type="text/javascript" src="/xls/js/xlsx.js"></script>
</head>
<body>
<div>
<input type='file' onchange='readFile(event)'>
</div>
<div>
<textarea id='debug' rows="50" cols="200"></textarea>
</div>
</body>
<script>
var excel = new Object();
var sheet = new Object();
var row = new Object();
var cell = new Object();
var x ;
var wb;
var output;
var filename;
var rows_a,rows_b;
var cols_a,cols_b;
var range = new Object();
var readFile = function(event) {
var read = new FileReader();
var file = event.target.files[0];
read.readAsBinaryString(file);
filename = file.name;
read.onload = function (event){
var res = event.currentTarget.result;
var fileType = getFileType(filename).toString();
switch (fileType){
case '.xls':
x = XLS;
break;
case '.xlsx':
x = XLSX;
break;
default:
x = null;
}
if(x){
wb = x.read(res, { type: 'binary' });
excel = getEXCEL(wb);
output = excel;
}else{
var info = {error:'can not resolve file end with :'+fileType};
output = getOutput(info,'obj');
}
console.log(output);
out_json = getOutput(output,'json');
$('#debug').val(out_json);
};
};
function getEXCEL(wb){
var Sheetnames = wb.SheetNames;
var Sheets = new Object();
var Sheet = new Object();
Sheets = wb.Sheets;
excel['sheetSize'] = Sheetnames.length.toString();
excel['excelName'] = filename;
excel["sheets"] = [];
for(var i=0;i<Sheetnames.length;i++){
Sheet = Sheets[Sheetnames[i]];
range = getRanger(Sheet['!ref']);
rows_a = range.row;
cols_a = range.col;
var m = 0;
sheet = new Object();
sheet['rowSize'] = rows_a.toString();
sheet['colSize'] = cols_a.toString();
sheet['sheetName'] = Sheetnames[i];
sheet["rows"] = [];
sheet["title"] = new Object();
for(var j=0;j<rows_a;j++){
row = new Object();
row['cells'] = [];
for(var m=0;m<cols_a;m++){
cell = new Object();
row['cells'].push(cell);
}
sheet["rows"].push(row);
}
for(k in Sheet){
if(isCell(k)){
range = getRanger(k);
rows_b = range.row.toString();
cols_b = range.col.toString();
row = sheet["rows"][rows_b-1];
row.val = null;
row.val = 'true';
cell = row['cells'][cols_b-1];
cell.value = null;
cell.value = Sheet[k].w;
}
}
for(t in sheet["rows"]){
var tit = sheet["rows"][t];
if(tit.val){
sheet["title"] = sheet["rows"][t];
break;
}
}
excel["sheets"].push(sheet);
}
return excel;
}
function isCell(str){
var reg = /^[a-zA-Z]+[0-9]+$/;
return reg.test(str);
}
function getRowNumber(key){
var reg = /[0-9]+$/;
var rownumber = reg.exec(key);
return rownumber;
}
function getColLetter(key){
var reg = /^[a-zA-Z]+/;
var colletter = reg.exec(key);
return colletter;
}
function getColNumber(key){
var reg = /[a-zA-Z]+/;
var colletter = reg.exec(key);
return colletter;
}
function getOutput(obj,type){
switch (type){
case 'json' :
return JSON.stringify(obj);
break;
case 'obj' :
return obj;
break;
default :
return JSON.stringify(obj);
}
}
function getRanger(ref){
if(ref == undefined){
range.row = "0";
range.col = "0";
}else{
var reg = /:[a-zA-Z]+[0-9]+/;
var reg2 = /^[a-zA-Z]+[0-9]+$/;
var pos = reg.exec(ref);
if(pos == undefined ){
pos = reg2.exec(ref);
}
var r = getRowNumber(pos).toString();
var codes = [];
var n;
var letter = getColNumber(pos).toString();
letter = letter.toLocaleLowerCase();
n = 0;
for(i in letter){
var code = letter[i].charCodeAt()-96;
codes[i] = code;
n++;
}
n--;
var mathstr = 0;
for(j in codes){
mathstr = 'Math.pow(26,'+n+')*'+codes[j] + '+'+ mathstr;
n--;
}
var c = eval(mathstr).toString();
range.row = r;
range.col = c;
}
return range;
}
function getFileType(filepath){
var reg = /.[a-zA-Z0-9]+$/;
var filePostfix = reg.exec(filepath);
return filePostfix;
}
</script>
</html>
根据上面的代码我自己调试，中间发现一些自己认为要记录的东西：
SHEETJS自己解析数据后的 SHEET 对象格式如最下面的
F7: {t: 'n', v: 222, w: '222'}
还有一种
B24: {t: 's', v: '2.16教育', r: '<t>2.16教育</t>', h: '2.16教育', w: '2.16教育'}
B25: {t: 's', v: '2.17卫生和社会工作', r: '<r><rPr><sz val="10"/><rFont val="宋体"/><charset va…="宋体"/><charset val="134"/></rPr><t>和社会工作</t></r>', h: '<span style="font-size:10pt;">2.17卫生</span><span style="font-size:10pt;">和社会工作</span>', w: '2.17卫生和社会工作'}
B26: {t: 's', v: '2.18文化、体育和娱乐业', r: '<t>2.18文化、体育和娱乐业</t>', h: '2.18文化、体育和娱乐业', w: '2.18文化、体育和娱乐业'}B27: {t: 's', v: '2.19公共管理、社会保障和社会组织', r: '<t>2.19公共管理、社会保障和社会组织</t>', h: '2.19公共管理、社会保障和社会组织', w: '2.19公共管理、社会保障和社会组织'}
估摸着
t 表示类型，其中 s 表示是字符串 n 表示数字
v表示值 value
w: 表示 word ??
于是我把内容粘贴下来了
Sheet[k].w
'第VII部分： 贷款分行业情况表'
sheet[k].w
VM181:1 Uncaught TypeError: Cannot read properties of undefined (reading 'w')
at eval (eval at getEXCEL (demo5.html:89:25), <anonymous>:1:10)
at getEXCEL (demo5.html:113:25)
at FileReader.read.onload (demo5.html:58:29)
eval @ VM181:1
getEXCEL @ demo5.html:113
read.onload @ demo5.html:58
load (async)
readFile @ demo5.html:43
onchange @ demo5.html:18
Sheet
{!ref: 'A1:F44', A1: {…}, A2: {…}, C2: {…}, A3: {…}, …}!margins: {left: 0.7, right: 0.7, top: 0.75, bottom: 0.75, header: 0.3, …}!merges: (80) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]!ref: "A1:F44"A1: {t: 's', v: '第VII部分： 贷款分行业情况表', r: '<t>第VII部分： 贷款分行业情况表</t>', h: '第VII部分： 贷款分行业情况表', w: '第VII部分： 贷款分行业情况表'}A2: {t: 's', v: '填报机构：', r: '<t>填报机构：</t>', h: '填报机构：', w: '填报机构：'}A3: {t: 's', v: ' 项目 \n\n \n行业名称 ', r: '<t xml:space="preserve"> 项目
&#…;行业名称 </t>', h: ' 项目 <br/><br/> <br/>行业名称 ', w: ' 项目 \n\n \n行业名称 '}A7: {t: 'n', v: 1, w: '1'}A8: {t: 'n', v: 2, w: '2'}t: "n"v: 2w: "2"[[Prototype]]: ObjectA9: {t: 'n', v: 3, w: '3'}A10: {t: 'n', v: 4, w: '4'}A11: {t: 'n', v: 5, w: '5'}A12: {t: 'n', v: 6, w: '6'}A13: {t: 'n', v: 7, w: '7'}A14: {t: 'n', v: 8, w: '8'}A15: {t: 'n', v: 9, w: '9'}A16: {t: 'n', v: 10, w: '10'}A17: {t: 'n', v: 11, w: '11'}A18: {t: 'n', v: 12, w: '12'}A19: {t: 'n', v: 13, w: '13'}A20: {t: 'n', v: 14, w: '14'}A21: {t: 'n', v: 15, w: '15'}A22: {t: 'n', v: 16, w: '16'}A23: {t: 'n', v: 17, w: '17'}A24: {t: 'n', v: 18, w: '18'}A25: {t: 'n', v: 19, w: '19'}A26: {t: 'n', v: 20, w: '20'}A27: {t: 'n', v: 21, w: '21'}A28: {t: 'n', v: 22, w: '22'}A29: {t: 'n', v: 23, w: '23'}A30: {t: 'n', v: 24, w: '24'}A31: {t: 'n', v: 25, w: '25'}A32: {t: 'n', v: 26, w: '26'}A33: {t: 'n', v: 27, w: '27'}A34: {t: 'n', v: 28, w: '28'}A35: {t: 'n', v: 29, w: '29'}A36: {t: 'n', v: 30, w: '30'}A37: {t: 's', v: '附注项目', r: '<t>附注项目</t>', h: '附注项目', w: '附注项目'}A38: {t: 'n', v: 31, w: '31'}A39: {t: 'n', v: 34, w: '34'}A40: {t: 'n', v: 35, w: '35'}A41: {t: 'n', v: 36, w: '36'}A42: {t: 'n', v: 37, w: '37'}A43: {t: 'n', v: 38, w: '38'}A44: {t: 'n', v: 39, w: '39'}B7: {t: 's', v: '1.各项贷款', r: '<t>1.各项贷款</t>', h: '1.各项贷款', w: '1.各项贷款'}B8: {t: 's', v: '2.对境内贷款', r: '<t>2.对境内贷款</t>', h: '2.对境内贷款', w: '2.对境内贷款'}B9: {t: 's', v: '2.1农、林、牧、渔业', r: '<t>2.1农、林、牧、渔业</t>', h: '2.1农、林、牧、渔业', w: '2.1农、林、牧、渔业'}B10: {t: 's', v: '2.2采矿业', r: '<t>2.2采矿业</t>', h: '2.2采矿业', w: '2.2采矿业'}B11: {t: 's', v: '2.3制造业', r: '<t>2.3制造业</t>', h: '2.3制造业', w: '2.3制造业'}B12: {t: 's', v: '2.4电力、热力、燃气及水的生产和供应业', r: '<t>2.4电力、热力、燃气及水的生产和供应业</t>', h: '2.4电力、热力、燃气及水的生产和供应业', w: '2.4电力、热力、燃气及水的生产和供应业'}B13: {t: 's', v: '2.5建筑业', r: '<t>2.5建筑业</t>', h: '2.5建筑业', w: '2.5建筑业'}B14: {t: 's', v: '2.6批发和零售业', r: '<r><rPr><sz val="10"/><rFont val="宋体"/><charset va…宋体"/><charset val="134"/></rPr><t>6批发和零售业</t></r>', h: '<span style="font-size:10pt;">2.</span><span style="font-size:10pt;">6批发和零售业</span>', w: '2.6批发和零售业'}B15: {t: 's', v: '2.7交通运输、仓储和邮政业', r: '<r><rPr><sz val="10"/><rFont val="宋体"/><charset va…<charset val="134"/></rPr><t>7交通运输、仓储和邮政业</t></r>', h: '<span style="font-size:10pt;">2.</span><span style="font-size:10pt;">7交通运输、仓储和邮政业</span>', w: '2.7交通运输、仓储和邮政业'}B16: {t: 's', v: '2.8住宿和餐饮业', r: '<r><rPr><sz val="10"/><rFont val="宋体"/><charset va…宋体"/><charset val="134"/></rPr><t>8住宿和餐饮业</t></r>', h: '<span style="font-size:10pt;">2.</span><span style="font-size:10pt;">8住宿和餐饮业</span>', w: '2.8住宿和餐饮业'}B17: {t: 's', v: '2.9信息传输、软件和信息技术服务业', r: '<t>2.9信息传输、软件和信息技术服务业</t>', h: '2.9信息传输、软件和信息技术服务业', w: '2.9信息传输、软件和信息技术服务业'}B18: {t: 's', v: '2.10金融业', r: '<t>2.10金融业</t>', h: '2.10金融业', w: '2.10金融业'}B19: {t: 's', v: '2.11房地产业', r: '<t>2.11房地产业</t>', h: '2.11房地产业', w: '2.11房地产业'}B20: {t: 's', v: '2.12租赁和商务服务业', r: '<t>2.12租赁和商务服务业</t>', h: '2.12租赁和商务服务业', w: '2.12租赁和商务服务业'}B21: {t: 's', v: '2.13科学研究和技术服务业', r: '<t>2.13科学研究和技术服务业</t>', h: '2.13科学研究和技术服务业', w: '2.13科学研究和技术服务业'}B22: {t: 's', v: '2.14水利、环境和公共设施管理业', r: '<t>2.14水利、环境和公共设施管理业</t>', h: '2.14水利、环境和公共设施管理业', w: '2.14水利、环境和公共设施管理业'}B23: {t: 's', v: '2.15居民服务、修理和其他服务业', r: '<t>2.15居民服务、修理和其他服务业</t>', h: '2.15居民服务、修理和其他服务业', w: '2.15居民服务、修理和其他服务业'}B24: {t: 's', v: '2.16教育', r: '<t>2.16教育</t>', h: '2.16教育', w: '2.16教育'}B25: {t: 's', v: '2.17卫生和社会工作', r: '<r><rPr><sz val="10"/><rFont val="宋体"/><charset va…="宋体"/><charset val="134"/></rPr><t>和社会工作</t></r>', h: '<span style="font-size:10pt;">2.17卫生</span><span style="font-size:10pt;">和社会工作</span>', w: '2.17卫生和社会工作'}B26: {t: 's', v: '2.18文化、体育和娱乐业', r: '<t>2.18文化、体育和娱乐业</t>', h: '2.18文化、体育和娱乐业', w: '2.18文化、体育和娱乐业'}B27: {t: 's', v: '2.19公共管理、社会保障和社会组织', r: '<t>2.19公共管理、社会保障和社会组织</t>', h: '2.19公共管理、社会保障和社会组织', w: '2.19公共管理、社会保障和社会组织'}B28: {t: 's', v: '2.20国际组织', r: '<t>2.20国际组织</t>', h: '2.20国际组织', w: '2.20国际组织'}B29: {t: 's', v: '2.21 个人贷款(不含个人经营性贷款)', r: '<t>2.21 个人贷款(不含个人经营性贷款)</t>', h: '2.21 个人贷款(不含个人经营性贷款)', w: '2.21 个人贷款(不含个人经营性贷款)'}B30: {t: 's', v: ' 2.21.1信用卡', r: '<t xml:space="preserve"> 2.21.1信用卡</t>', h: ' 2.21.1信用卡', w: ' 2.21.1信用卡'}B31: {t: 's', v: ' 2.21.2汽车', r: '<t xml:space="preserve"> 2.21.2汽车</t>', h: ' 2.21.2汽车', w: ' 2.21.2汽车'}B32: {t: 's', v: ' 2.21.3住房按揭贷款', r: '<t xml:space="preserve"> 2.21.3住房按揭贷款</t>', h: ' 2.21.3住房按揭贷款', w: ' 2.21.3住房按揭贷款'}B33: {t: 's', v: ' 2.21.4其他', r: '<t xml:space="preserve"> 2.21.4其他</t>', h: ' 2.21.4其他', w: ' 2.21.4其他'}B34: {t: 's', v: '2.22买断式转贴现', r: '<t>2.22买断式转贴现</t>', h: '2.22买断式转贴现', w: '2.22买断式转贴现'}B35: {t: 's', v: '2.23买断其他票据类资产', r: '<t>2.23买断其他票据类资产</t>', h: '2.23买断其他票据类资产', w: '2.23买断其他票据类资产'}B36: {t: 's', v: '3.对境外贷款', r: '<t>3.对境外贷款</t>', h: '3.对境外贷款', w: '3.对境外贷款'}B38: {t: 's', v: '4.高技术产业', r: '<t>4.高技术产业</t>', h: '4.高技术产业', w: '4.高技术产业'}B39: {t: 's', v: '5.数字经济核心产业', r: '<t>5.数字经济核心产业</t>', h: '5.数字经济核心产业', w: '5.数字经济核心产业'}B40: {t: 's', v: '5.1数字产品制造业', r: '<t>5.1数字产品制造业</t>', h: '5.1数字产品制造业', w: '5.1数字产品制造业'}B41: {t: 's', v: '5.2数字产品服务业', r: '<t>5.2数字产品服务业</t>', h: '5.2数字产品服务业', w: '5.2数字产品服务业'}B42: {t: 's', v: '5.3数字技术应用业', r: '<t>5.3数字技术应用业</t>', h: '5.3数字技术应用业', w: '5.3数字技术应用业'}B43: {t: 's', v: '5.4数字要素驱动业', r: '<t>5.4数字要素驱动业</t>', h: '5.4数字要素驱动业', w: '5.4数字要素驱动业'}B44: {t: 's', v: '6.知识产权密集型产业', r: '<t>6.知识产权密集型产业</t>', h: '6.知识产权密集型产业', w: '6.知识产权密集型产业'}C2: {t: 's', v: '报表日期： 年 月 日 单位：万元', r: '<t>报表日期： 年 月 日 单位：万元</t>', h: '报表日期： 年 月 日 单位：万元', w: '报表日期： 年 月 日 单位：万元'}D3: {t: 's', v: 'A', r: '<t>A</t>', h: 'A', w: 'A'}D4: {t: 's', v: '各项贷款', r: '<t>各项贷款</t>', h: '各项贷款', w: '各项贷款'}h: "各项贷款"r: "<t>各项贷款</t>"t: "s"v: "各项贷款"w: "各项贷款"[[Prototype]]: ObjectD7: {t: 'n', v: 111, w: '111'}F3: {t: 's', v: 'B', r: '<t>B</t>', h: 'B', w: 'B'}F4: {t: 's', v: '其中：中长期贷款', r: '<t>其中：中长期贷款</t>', h: '其中：中长期贷款', w: '其中：中长期贷款'}F7: {t: 'n', v: 222, w: '222'}[[Prototype]]: Objectconstructor: ƒ Object()hasOwnProperty: ƒ hasOwnProperty()isPrototypeOf: ƒ isPrototypeOf()propertyIsEnumerable: ƒ propertyIsEnumerable()toLocaleString: ƒ toLocaleString()toString: ƒ toString()valueOf: ƒ valueOf()__defineGetter__: ƒ __defineGetter__()__defineSetter__: ƒ __defineSetter__()__lookupGetter__: ƒ __lookupGetter__()__lookupSetter__: ƒ __lookupSetter__()__proto__: (...)get __proto__: ƒ __proto__()set __proto__: ƒ __proto__()
demo5.html:64 {sheetSize: '3', excelName: 'G01_VII.xlsx', sheets: Array(3)}
查看官方资料发现：后面一列是我蹩脚的英文理解
| Key | Description | 我自己的理解 |
|---|---|---|
v |
raw value (see Data Types section for more info) | 值 |
w |
formatted text (if applicable) | 文本格式的值 |
t |
type: b Boolean, e Error, n Number, d Date, s Text, z Stub |
类型 boolean 布尔型 e 错误 n 数值型 d 日期型 s Text文本型 z 残存？？ |
f |
cell formula encoded as an A1-style string (if applicable) | 自定义公式？？ |
F |
range of enclosing array if formula is array formula (if applicable) | 下拉数据组 |
r |
rich text encoding (if applicable) | 富文本型 |
h |
HTML rendering of the rich text (if applicable) | HTML 类型的文本 |
c |
comments associated with the cell | 备注 |
z |
number format string associated with the cell (if requested) | 与单元格关联的数字格式字符串 百度翻译的 |
l |
cell hyperlink object (.Target holds link, .Tooltip is tooltip) |
单元格链接 |
s |
the style/theme of the cell (if applicable) | 样式 |
其实人家早就写好了啊。唉~~~
还是人家牛批啊~~~
官方的链接：
https://docs.sheetjs.com/#json
还有一个网址也非常值得参考
https://www.cnblogs.com/liuxianan/p/js-excel.html
用空常来坐坐
https://www.cnblogs.com/alexgl2008/
浙公网安备 33010602011771号