能否将Excel表格导入网站并实现可搜索、可筛选的展示功能？

这个需求完全可以落地，不需要放弃现有思路，整体操作比手动编写HTML表格效率高很多，100行4列的表格完全没有性能压力，具体操作步骤如下：

• 第一步：导出Excel源文件为通用格式
  打开你要发布的Excel表格，点击「另存为」，选择格式为CSV UTF-8(逗号分隔)(*.csv)即可；如果你不想做格式转换，也可以直接保留原有的.xlsx格式，后续工具支持直接解析。
• 第二步：引入开源工具库省略重复代码
  你不需要自己手动写表格渲染、搜索筛选的逻辑，直接引入两个通用前端工具库即可：
  1. 解析表格文件的SheetJS库，支持直接读取CSV、XLSX格式的文件内容
  2. 实现表格交互功能的Datatables库，自带搜索、筛选、排序、分页等你需要的所有功能
     两个库都可以直接使用公共CDN资源，不需要本地下载部署。
• 第三步：插入少量代码自动生成目标表格
  你可以直接使用下方的代码框架，仅需要替换其中的文件路径为你自己的表格文件路径即可：

<!DOCTYPE html>
<html>
<head>
  <!-- 引入Datatables样式 -->
  <link rel="stylesheet" href="对应Datatables CSS的公共CDN地址">
</head>
<body>
  <!-- 表格容器 -->
  <table id="targetTable" class="display" style="width:100%"></table>

  <!-- 引入依赖库 -->
  <script src="对应SheetJS的公共CDN地址"></script>
  <script src="对应jQuery的公共CDN地址"></script>
  <script src="对应Datatables JS的公共CDN地址"></script>

  <script>
    // 读取表格文件，这里替换成你自己的文件路径
    fetch('你的表格文件路径.csv')
      .then(res => res.arrayBuffer())
      .then(data => {
        // 解析文件内容
        const workbook = XLSX.read(data, {type: 'array'});
        const firstSheet = workbook.Sheets[workbook.SheetNames[0]];
        // 转换为HTML表格字符串
        const htmlStr = XLSX.utils.sheet_to_html(firstSheet, {id: "targetTable"});
        document.getElementById('targetTable').outerHTML = htmlStr;
        // 初始化搜索筛选功能
        $('#targetTable').DataTable();
      })
  </script>
</body>
</html>

• 后续发布操作
  把你的表格文件和上面的HTML文件一起上传到你的网站服务器即可，所有功能都可以正常运行，不需要依赖OneDrive等第三方云服务，不会有你担心的安全问题。

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