js读取excel解析成json数据的方法

最新推荐文章于 2025-10-13 23:12:21 发布

原创最新推荐文章于 2025-10-13 23:12:21 发布 · 4.2k 阅读

10 ·

CC 4.0 BY-SA版权

文章标签：

#js

js读取excel方法专栏收录该内容

1 篇文章

订阅专栏

本文介绍了两种在JavaScript中读取Excel文件并将其解析为JSON数据的方法，特别推荐方法二，因为其简单易用，解析后的数据可以直接打印查看。

js读取excel解析成json数据的方法

方法一
方法二
- - 个人总结方法二是比较好用的，数据直接用打印出来就能看的到了

方法一

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="http://oss.sheetjs.com/js-xlsx/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'
                    });
                }
                // console.log(JSON.stringify(wb.Sheets[0]))

                //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]]));
                console.log(JSON.stringify(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>

方法二

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>js读取excel</title>
    <script src="http://oss.sheetjs.com/js-xlsx/xlsx.full.min.js"></script>
    <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 aa = [];
        var text = [];
        var rABS = false; //是否将文件读取为二进制字符串

        function importExcel(obj) { //导入
            if (!obj.files) {
                return;
            }
            const IMPORTFILE_MAXSIZE = 1 * 2048; //这里可以自定义控制导入文件大小
            var suffix = obj.files[0].name.split(".")[1]
            if (suffix != 'xls' && suffix != 'xlsx') {
                alert('导入的文件格式不正确!')
                return
            }
            if (obj.files[0].size / 1024 > IMPORTFILE_MAXSIZE) {
                alert('导入的表格文件不能大于2M')
                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的数据
                aa = JSON.stringify(XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]));
                var u = eval('(' + aa + ')');
                document.getElementById("demo").innerHTML = JSON.stringify(XLSX.utils.sheet_to_json(wb.Sheets[wb
                    .SheetNames[0]]));
                console.log(wb.Sheets[wb.SheetNames[0]])
                //获取表格中为address的那列存入text中
                for (var i = 0; i < u.length; i++) {
                    text.push(u[i].address);
                }

            };
            if (rABS) {
                reader.readAsArrayBuffer(f);
            } else {
                reader.readAsBinaryString(f);
            }
        }
    </script>
</head>

<body>

    <input type="file" onchange="importExcel(this)" />
    <div id="demo"></div>

</body>

</html>