背景：
? ? ? ?本來(lái)是打算使用ActiveXObject來(lái)處理Excel控汉，后面發(fā)現(xiàn)谷歌瀏覽器居然用不了這個(gè)對(duì)象笔诵；也怪我才疏學(xué)淺，百度了之后發(fā)現(xiàn)這玩意是IE的一個(gè)黑科技姑子，其它瀏覽器居然用不了乎婿？！街佑。所以采用xlsx.full.min.js插件來(lái)處理這類(lèi)問(wèn)題谢翎。（簡(jiǎn)書(shū).YZJGOOD原創(chuàng)文章，轉(zhuǎn)載請(qǐng)注明出處）
導(dǎo)入（需要xlsx.full.min.js）：
html:
<!--by yzjgood 前臺(tái)按鈕-->
<div class="button_su" id="zhuangzai">
? ? ? ? <a href="#" class="button_su_inner">
? ? ? ? ? <span class="button_text_container">
? ? ? ? ? ? 裝載數(shù)據(jù)
? ? ? ? ? </span>
? ? ? ? </a>
?</div>
<input id="zhenzhuangzai" type="file" onchange="impexcel(this)" style="display: none;" />
JS:
// by yzjgood 通過(guò)JQuery獲取元素觸發(fā)函數(shù)
$(function(){
? ? $("#zhuangzai").click(function(){
? ? ? ? $("#zhenzhuangzai").trigger("click");
? ? ? });
? });
var wb;// 讀取完成的數(shù)據(jù)
? ? // 導(dǎo)入
? ? function impexcel(obj) {
? ? ? ? if (!obj.files) {
? ? ? ? ? ? return;
? ? ? ? }
? ? ? ? var f = obj.files[0];
//新建文件讀取
? ? ? ? var reader = new FileReader();
? ? ? ? reader.onload = function(e) {
? ? ? ? ? ? var data = e.target.result;
? ? ? ? ? ? //將文件讀取為二進(jìn)制字符串
? ? ? ? ? ? wb = XLSX.read(data, {type : 'binary'});
? ? ? ? ? ?console.log(wb.SheetNames[0]);
? ? ? ? ????// wb.SheetNames[0]是獲取Sheets中第一個(gè)Sheet的名字
? ? ? ? ????// wb.Sheets[Sheet名]獲取第一個(gè)Sheet的數(shù)據(jù)
????????????//數(shù)組形式輸出數(shù)據(jù)
????????????var arr=XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
????????????console.log(arr);
????????????for(var key in arr){
????????????????//輸出下角標(biāo)
? ? ? ? ? ? ? ? //console.log(key);
????????????????//輸出每個(gè)元素（對(duì)象形式）
????????????????console.log(key,arr[key]);
????????????????//輸出每個(gè)元素的值（數(shù)組形式）
????????????????console.log(Object.values(arr[key]));
????????????????//將數(shù)組轉(zhuǎn)化為字符串以“,”分割（字符串形式）
????????????????var strsub=Object.values(arr[key]).toString();
????????????????console.log(strsub);
????????????}
????????????//字符串形式輸出（原模原樣的將數(shù)組對(duì)象轉(zhuǎn)為字符串）
? ? ? ? ????var str=JSON.stringify(arr);
????????????console.log(str);
? ? ? ? ????};
? ? ? ? ????reader.readAsBinaryString(f);
? ????? }
導(dǎo)出（需要xlsx.full.min.js）：
“導(dǎo)出”這個(gè)功能查閱了了很多資料沐旨，經(jīng)過(guò)測(cè)試以下方法真實(shí)可用森逮，分享給廣大好友。
<!DOCTYPE html>
<html>
? ? <head>
? ? ? ? <meta charset="UTF-8">
? ? ? ? <title></title>
? ? </head>
<body>
? ? <button onclick="downloadExl(jsono)">導(dǎo)出 Excel</button>
? ? <script src="xlsx.full.min.js"></script>
? ? <!--調(diào)用FileSaver的saveAs函數(shù)也可以替代 a 標(biāo)簽實(shí)現(xiàn)文件下載-->
? ? <!-- <script src = "./FileSaver.min.js"></script> -->
? ? <script>
? ? ? ? //如果使用 FileSaver.js 就不要同時(shí)使用以下函數(shù)
? ? ? ? function saveAs(obj, fileName) {
? ? ? ? ? ? //當(dāng)然可以自定義簡(jiǎn)單的下載文件實(shí)現(xiàn)方式
? ? ? ? ? ? var tmpa = document.createElement("a");
? ? ? ? ? ? tmpa.download = fileName || "下載";
? ? ? ? ? ? tmpa.href = URL.createObjectURL(obj);
? ? ? ? ? ? //綁定a標(biāo)簽
? ? ? ? ? ? tmpa.click();
? ? ? ? ? ? //模擬點(diǎn)擊實(shí)現(xiàn)下載
? ? ? ? ? ? setTimeout(function () {
? ? ? ? ? ? //延時(shí)釋放
? ? ? ? ? ? ? ? URL.revokeObjectURL(obj);
? ? ? ? ? ? ? ? //用URL.revokeObjectURL()來(lái)釋放這個(gè)object URL
? ? ? ? ? ? }, 100);
? ? ? ? }
? ? ? ? var jsono = [
? ? ? ? ? ? { //測(cè)試數(shù)據(jù)1
? ? ? ? ? ? ? ? "姓名" : "Condor Hero",
? ? ? ? ? ? ? ? "年齡" : 18 ,
? ? ? ? ? ? ? ? "體重" : "60kg"
? ? ? ? ? ? },
? ? ? ? ? ? { //測(cè)試數(shù)據(jù)2
? ? ? ? ? ? ? ? "姓名" : "標(biāo)標(biāo)",
? ? ? ? ? ? ? ? "年齡" : 34 ,
? ? ? ? ? ? ? ? "體重" : "70kg"
? ? ? ? ? ? },
? ? ? ? ? ? { //測(cè)試數(shù)據(jù)3
? ? ? ? ? ? ? ? "姓名" : "老馮",
? ? ? ? ? ? ? ? "年齡" : 54 ,
? ? ? ? ? ? ? ? "體重" : "80kg",
? ? ? ? ? ? ? ? "性別" : "女"
? ? ? ? ? ? }
? ? ? ? ];
? ? ? ? const wopts = { bookType: 'xlsx', bookSST: false, type: 'binary' };//這里的數(shù)據(jù)是用來(lái)定義導(dǎo)出的格式類(lèi)型
? ? ? ? function downloadExl(data, type) {
? ? ? ? ? ? const wb = { SheetNames: ['Sheet1'], Sheets: {}, Props: {} };
? ? ? ? ? ? wb.Sheets['Sheet1'] = XLSX.utils.json_to_sheet(data);
? ? ? ? ? ? //通過(guò)json_to_sheet轉(zhuǎn)成單頁(yè)(Sheet)數(shù)據(jù)
? ? ? ? ? ? saveAs(new Blob([s2ab(XLSX.write(wb, wopts))], { type: "application/octet-stream" }), "這里是下載的文件名" + '.' + (wopts.bookType=="biff2"?"xls":wopts.bookType));
? ? ? ? }
? ? ? ? function s2ab(s) {
? ? ? ? ? ? if (typeof ArrayBuffer !== 'undefined') {
? ? ? ? ? ? ? ? var buf = new ArrayBuffer(s.length);
? ? ? ? ? ? ? ? var view = new Uint8Array(buf);
? ? ? ? ? ? ? ? for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
? ? ? ? ? ? ? ? return buf;
? ? ? ? ? ? } else {
? ? ? ? ? ? ? ? var buf = new Array(s.length);
? ? ? ? ? ? ? ? for (var i = 0; i != s.length; ++i) buf[i] = s.charCodeAt(i) & 0xFF;
? ? ? ? ? ? ? ? return buf;
? ? ? ? ? ? }
? ? ? ? }
? ? </script>
</body>
</html>
? 好的磁携，這次的分享就到這里褒侧，謝謝！
（簡(jiǎn)書(shū).YZJGOOD原創(chuàng)文章谊迄，轉(zhuǎn)載請(qǐng)注明出處）
