通常，一般读取Excel都是由后台来处理，不过如果需求要前台来处理，也是可以的。、

1.需要用到js-xlsx，下载地址：js-xlsx

2.demo:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="./js/xlsx.full.min.js"></script>
    </head>
    <body>
        <input type="file"onchange="importf(this)" />
        <div id="demo"></div>
        <script>
            /*
            FileReader共有4种读取方法：
            1.readAsArrayBuffer(file)：将文件读取为ArrayBuffer。
            2.readAsBinaryString(file)：将文件读取为二进制字符串
            3.readAsDataURL(file)：将文件读取为Data URL
            4.readAsText(file, [encoding])：将文件读取为文本，encoding缺省值为'UTF-8'
                         */
            var wb;//读取完成的数据
            var rABS = false; //是否将文件读取为二进制字符串

function importf(obj) {//导入
                if(!obj.files) {
                    return;
                }
                var f = obj.files[0];
                var reader = new FileReader();
                reader.onload = function(e) {
                    var data = e.target.result;
                    if(rABS) {
                        wb = XLSX.read(btoa(fixdata(data)), {//手动转化
                            type: 'base64'
                        });
                    } else {
                        wb = XLSX.read(data, {
                            type: 'binary'
                        });
                    }
                    //wb.SheetNames[0]是获取Sheets中第一个Sheet的名字
                    //wb.Sheets[Sheet名]获取第一个Sheet的数据
                   
document.getElementById("demo").innerHTML= JSON.stringify(
XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]) );
                };
                if(rABS) {
                    reader.readAsArrayBuffer(f);
                } else {
                    reader.readAsBinaryString(f);
                }
            }

function fixdata(data) { //文件流转BinaryString
                var o = "",
                    l = 0,
                    w = 10240;
               
for(; l < data.byteLength / w; ++l) o +=
String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w, l * w +
w)));
                o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w)));
                return o;
            }
        </script>
    </body>
</html>

js 解析本地Excel文件！的更多相关文章

  1. JS 读取本地Excel文件

    首先我们先引用一个Excel的类库xlsx.full.min.js 中间处理: 'use strict'; var ExcelReader = { isFirstRead: true, fixdata ...

  2. Python3+Requests-HTML+Requests-File解析本地html文件

    一.说明 解析html文件我喜欢用xpath不喜欢用BeautifulSoup,Requests的作者出了Requests-HTML后一般都用Requests-HTML. 但是Requests-HTM ...

  3. JS客户端读取Excel文件插件js-xls使用方法

    js-xls是一款客户端读取Excel的插件,亲测IE11.FireFox.Chrome可用,读取速度也客观. 插件Demo地址:http://oss.sheetjs.com/js-xlsx/    ...

  4. Excelbatis-一个将excel文件读入成实体列表、将实体列表解析成excel文件的ORM框架，简洁易于配置、可扩展性好

    欢迎使用Excelbatis! github地址:https://github.com/log4leo/Excelbatis Excelbatis的优点 和spring天然结合,易于接入 xsd支持, ...

  5. js上传Excel文件

    一.问题 需要在项目里添加一个上传excel文件的功能,因为其他同样的后台里面有上传文件的功能,第一反应就是想着直接用.了解了一下发现它是利用bootstrap的fileinput实现的,但是我怎么都 ...

  6. Java解析导入Excel文件后台代码实现

    使用MultipartFile上传Excel文件后端代码实现:(springmvc下的spring-webmvc (MultipartFile )上传) 由于POST一个包含文件上传的Form会以mu ...

  7. python解析本地HTML文件

    Python使用爬虫技术时,每运行一次,本地都会访问一次主机.为避免完成程序前调试时多次访问主机增加主机负荷,我们可以在编写程序前将网页源代码存在本地,调试时访问本地文件即可.现在我来分享一下爬取资料 ...

  8. .NET 客户端上传本地excel文件到服务器上,并在客户端显示

    // 上传按钮 protected void btnUp_Click(object sender, EventArgs e) { bool b = Upload(fuExcel); // 上传exce ...

  9. 开发一个简单的chrome插件-解析本地markdown文件

    准备软件环境 1. 软件环境 首先,需要使用到的软件和工具环境如下: 一个最新的chrome浏览器 编辑器vscode 2. 使用的js库 代码高亮库:prismjs https://prismjs. ...

随机推荐

  1. 把Eclipse项目转换成Maven项目

    把Maven项目转换成Eclipse项目只要使用Maven的Eclipse插件就能做到 mvn eclipse:eclipse 其实Maven的Eclipse插件也有把Eclipse项目转换成Mave ...

  2. JVM 体系结构

    JVM 是一种抽象的计算机,基于堆栈架构,它有自己的指令集和内存管理,是 Java 跨平台的依据,JVM解释执行字节码,或将字节码编译成本地代码执行.Java 虚拟机体系结构如下: Class Fil ...

  3. MVC+Spring.NET+NHibernate .NET SSH框架整合

    在JAVA中,SSH框架可谓是无人不晓,就和.NET中的MVC框架一样普及.作为一个初学者,可以感受到.NET出了MVC框架以后太灵活了(相比之前的web Form),嗯,关于.NET中的MVC框架我 ...

  4. 重启osd服务失败：Start request repeated too quickly

    背景 OS:Ubuntu 16.04 修改了osd的一些配置,修改后,需要重启osd服务才能生效.第一次重启后,配置立刻生效.再改了一些配置,重启osd服务后,配置却不再生效了.ps命令查看进程,发现 ...

  5. CentOS最小化安装后启用无线连接网络

    想要链接无线就需要无线工具包. yum install -y  wireless-tools安装完成之后就有 iwconfig,iwlist,iw等命令行工具了. 首先启动无线网卡,记得开启无线开关, ...

  6. iwebshop上传类的使用

    $upload = new IUpload('10240000',array('jpg','gif','png')); $dir = "upload/dian"; $upload- ...

  7. 关于JavaScript中连等赋值那点事

    今天看了前端网上关于JS的题目,其中有一道题目挺有意思的.如下 var a = b =10; (function(){ var a = b = 20; })(); console.log(a); co ...

  8. 【C++】指针与引用的区别

    本文主要总结在C++中指针与引用的区别. 从定义与性质来看指针与引用有如下区别: 指针表示的是一块变量的地址 引用表示一个变量的别名. 因此指针变量需要占用空间(一个指针变量在32位系统下占用4字节, ...

  9. Access中的自定义排序设置方式

    一.问题起因 最近有网友提问说,Access中在用查询指定排序方式时,为什么只有升序跟降序,怎么米有自定义排序了?竟然比Excel都弱啊! 其实这是对Access的误解,我这就给大家来解一下疑惑.案例 ...

  10. 老李分享：Web Services 架构 2

    服务传输层 这一层负责应用之间的消息传输.目前,该层包括了超文本传输协议(HTTP).简单邮件传输协议(SMTP).文件传输协议(FTP).以及一些新兴协议,比如块可扩展交换协议(BEEP). XML ...