利用 js-xlsx 实现 Excel 文件导入并解析Excel数据成json格式的数据并且获取其中某列数据

本是古典何须时尚 2022-05-15 01:09 279阅读 0赞

工作中遇到excel读取,记录下

<!DOCTYPE html>
    <html>
    
    <head>
    	<meta charset="UTF-8">
    	<title></title>
    	<script src="js/xlsx.full.min.js"></script>
    </head>
    
    <body>
    	<input type="file" onchange="importExcel(this)" />
    	<div id="demo"></div>
    	<textarea rows="10" cols="50" id="phone">
    
    	</textarea>
    	<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 worksheet = [];
    		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的数据
    				worksheet = JSON.stringify(XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]));
    				var u = eval('(' + worksheet + ')');
    				document.getElementById("demo").innerHTML = JSON.stringify(XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]));
    				//获取表格中为'手机号码'的那列存入text中
    				for (var i = 0; i < u.length; i++) {
    					if(isPoneAvailable(u[i].手机号码))
    					text.push(u[i].手机号码);
    				}
    				console.log(text)
    				document.getElementById("phone").innerHTML = text
    			};
    			if (rABS) {
    				reader.readAsArrayBuffer(f);
    			} else {
    				reader.readAsBinaryString(f);
    			}
    		}
    		//手机号码正则
    		function isPoneAvailable(str) {
                var myreg=/^[1][3,4,5,7,8][0-9]{9}$/;
                if (!myreg.test(str)) {
                    return false;
                } else {
                    return true;
                }
            }
    	</script>
    </body>
    
    </html>

需要读取的excel

![70][]

页面显示结果

![70 1][]

[70]: /images/20220515/2cd38100880d4f35ad3c8b700cd557b8.png
[70 1]: /images/20220515/8de29dfaba7b483aba7937c969808d74.png