- A+
所属分类:Web前端
一、首先需要需要引入需要的包
<script src="https://cdn.bootcss.com/xlsx/0.11.5/xlsx.core.min.js"></script>
二、一个上传文件的file类型的input标签
<input type="file" onchange="showPreview(this)">
三、js相关操作对选中.xls文件进行解析,获取数据
function showPreview(source) { // 获取传递过来的内容 let file = source.files[0]; // 创建 FileReader 示例 let showPreview = new FileReader(); // 读取文件 showPreview.readAsBinaryString(file) // 文件读取成功时的回调函数 showPreview.onload = (e) => { // 获取传递的表格 let data = e.target.result // 以二进制流方式读取到整份的excel 表格对象 let workbook = XLSX.read(data, { type: 'binary' }) // 储存获取到的数据 let persons = [] // 表格的表格范围,可用于判断表头是否数量是否正确 let fromTo = ''; // 遍历每张表读取 for (var sheet in workbook.Sheets) { // 判断文件是否是 excel 文件 if (workbook.Sheets.hasOwnProperty(sheet)) { // 对表格的内容进行处理 persons = persons.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet])); break; // 如果只取第一张表,就取消注释这行 } } //将persons赋值给要展示的表格数组里即可展示在界面 console.log(persons); } }