**前端js代码导入excle
这里我引用的js文件放在与H5文件同目录下。
**`
样式部分
<style>
#inp{
position: absolute;
position: relative;
}
td{
border: 1px solid #222;
}
</style>
H5标签部分
<input type="file" id="inp" onchange="changeC(this)">
<hr>
<table id="itb" style="border-collapse: collapse;">
</table>
js代码部分
<script src="./xlsx.core.min.js"></script>
<script src="./xlsx.mini.min.js"></script>
<script>
// function changeC(e){
// console.log(e)
// e.style.backgroundColor='#f0f'
// }
//document.getElementsByTagName('body')
//var inp=document.getElementById('inp');
var wb;//声明变量保存excle对象。
function changeC(e){
debugger
var f=e.files;//获取文件对象
var reader=new FileReader();
reader.onload=function(ev){
var data=ev.target.result;
wb=XLSX.read(data,{
type:'binary'
})
//console.log(wb);
//解析二进制文件为json字符串
let exdata=JSON.stringify( XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]))
// console.log(exdata)
//将json字符串解析为json对象。
let JPexdata=JSON.parse(exdata);
//*******************************************
var tbstr='<tr>';
var ltop=new Array();//保存列头数组。
let ititles=wb.Sheets[wb.SheetNames[0]];
for(let xx in ititles){
if(/^[A-Z]+1$/.test(xx)){//n位大写字母+数字1的认为是列首行。
tbstr+=`<td>${ititles[xx].w}</td>`;
ltop.push(ititles[xx].w)
}
}
tbstr+="</tr>";
//****************************
//整理数据为table格式
JPexdata.forEach(ee=>{
tbstr+=`<tr>`;
for(let i=0;i<ltop.length;i++){
let ii=ltop[i];
tbstr+=`<td>${ee[ii]?ee[ii]:''}</td>`;//将undefine 置为空。
}
tbstr+=`</tr>`;
})
console.log(ltop);
//********************************
//写入table
document.getElementById('itb').innerHTML=tbstr;
}
reader.readAsBinaryString(f[0]);
}
</script>
`
引用的js文件下载。
xlsx.core.min.js
xlsx.mini.min.js