如何在HTML中读取本地Excel文件并获取行数存入变量

首先要明确：浏览器出于安全限制，无法直接读取本地指定路径的文件，必须通过用户主动选择文件的方式来获取文件内容。以下是可行的实现方案，使用SheetJS（xlsx）库解析Excel文件，获取行数并存储到变量中展示：

步骤1：引入SheetJS库 #

直接使用CDN引入解析库：

<script src="https://cdn.jsdelivr.net/npm/xlsx@0.18.5/dist/xlsx.full.min.js"></script>

步骤2：HTML结构 #

添加文件选择控件和行数展示区域：

<input type="file" id="excelFile" accept=".xlsx, .xls">
<div>Excel文件行数：<span id="rowCount"></span></div>

步骤3：JavaScript逻辑 #

编写文件读取解析代码，将行数存入变量并在页面展示：

// 用于存储行数的全局变量
let excelRowCount = 0;

document.getElementById('excelFile').addEventListener('change', function(e) {
  const selectedFile = e.target.files[0];
  if (!selectedFile) return;

  const reader = new FileReader();
  reader.onload = function(event) {
    const fileData = new Uint8Array(event.target.result);
    const workbook = XLSX.read(fileData, { type: 'array' });
    
    // 取第一个工作表进行解析
    const firstSheet = workbook.Sheets[workbook.SheetNames[0]];
    // 获取工作表的单元格范围，计算总行数
    const cellRange = XLSX.utils.decode_range(firstSheet['!ref']);
    excelRowCount = cellRange.e.r + 1; // 行索引从0开始，需加1得到实际行数
    
    // 将行数展示到页面
    document.getElementById('rowCount').textContent = excelRowCount;
  };
  reader.readAsArrayBuffer(selectedFile);
});

本地桌面应用场景（直接读取指定路径） #

如果是开发本地桌面应用（而非普通网页），可以用Electron这类框架，借助Node.js文件系统API直接读取指定路径文件：

const XLSX = require('xlsx');
const fs = require('fs');

// 替换为你的Excel文件本地路径
const targetFilePath = './test.xlsx';

const workbook = XLSX.readFile(targetFilePath);
const firstSheet = workbook.Sheets[workbook.SheetNames[0]];
const cellRange = XLSX.utils.decode_range(firstSheet['!ref']);
const excelRowCount = cellRange.e.r + 1;

console.log('Excel总行数：', excelRowCount);

对现有代码的说明 #

你提供的现有代码仅用于计算HTML表格的行数，和读取解析Excel文件无关，需替换为上述针对Excel的处理逻辑。

内容的提问来源于stack exchange，提问作者SomePerson