JavaScript库读取Excel数据代码示例

利用JavaScript库中读取Excel数据通常依赖于第三方库，如js-xlsx或SheetJS。下面web建站小编给大家简单介绍一下如何利用js-xlsx库来读取Excel文件并将其转换为JSON对象的基本示例代码！

HTML语法代码：

<!-- 引入js-xlsx库 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18..png/xlsx.core.min.js"></script>

<!-- 文件选择器 -->
<input type="file" id="excelFileInput" accept=".xls, .xlsx" onchange="handleExcelFile(this.files[0])">

JavaScript语法代码：

function handleExcelFile(file) {
  // 检查是否选择了文件
  if (file) {
    // 创建FileReader对象
    var reader = new FileReader();

    // 定义读取完成后回调函数
    reader.onload = function(e) {
      // 通过js-xlsx库解析Excel文件内容
      var workbook = XLSX.read(e.target.result, { type: 'binary' });

      // 获取第一个工作表（通常为默认的Sheet1）
      var sheetName = workbook.SheetNames[0];
      var worksheet = workbook.Sheets[sheetName];

      // 将工作表数据转换为JSON对象数组
      var data = XLSX.utils.sheet_to_json(worksheet);

      // 处理解析后的数据（例如，显示在页面、发送至服务器等）
      console.log(data);
      // 或者进一步操作，如将数据写入数据库、渲染到表格等
    };

    // 开始读取Excel文件
    reader.readAsBinaryString(file);
  }
}

参数介绍：

1、用户通过<input type="file">元素选择Excel文件。

2、当文件选择发生改变时，触发onchange事件，调用handleExcelFile函数。

3、handleExcelFile函数接收用户选择的文件，创建一个FileReader对象。

4、设置FileReader的onload回调函数，当文件读取完成时，该函数会被调用。

5、使用XLSX.read方法读取文件内容，这里以二进制格式(type: 'binary')传递给它。

6、从工作簿对象中获取第一个工作表的名字和实际工作表对象。

7、使用XLSX.utils.sheet_to_json方法将工作表数据转换为JSON对象数组。

8、在控制台打印出解析后的数据，实际应用中可以替换为对数据的其他处理逻辑。