JSON是碼農們常用的資料格式，輕且友善，而直接手敲JSON卻是比較麻煩和令人心情崩潰的（因為重複的東西很多），是以很多碼農可能會和我一樣，選擇用Excel去輸入資料，然後再想辦法轉換成JSON格式。今天教大家使用JS 将 Excel 轉為 JSON的方法。
1.建立HTML檔案
<html hljs-string">"en">
<title> Convert Excel File To JSON </title>
<head>
<script>
</script>
</head>
<body>
</body>
複制代碼
我們可以使用<input>标簽接收上傳檔案。代碼如下：
<input type="file" id="fileUploader" name="fileUploader" accept=".xls, .xlsx"/>
複制代碼
2.監聽input change 事件
<script>
$(document).ready(function(){
$("#fileUploader").change(function(evt){
// 上傳檔案處理邏輯...
});
});
</script>
複制代碼
3.讀取上傳檔案
在這裡，我們假設使用者隻上傳一個檔案。
var selectedFile = evt.target.files[0];
複制代碼
接下來，我們将使用FileReader讀取該檔案資料。從這個FileReader，我們可以讀取excel檔案中的資料作為二進制字元串。然後我們使用XLSX，它是SheetJS js-xlsx的内置工具，将我們的二進制字元串轉換為JSON對象。引入 XLSX
<script lang =“javascript”src =“dist/xlsx.full.min.js”> </ script>
複制代碼
您可以下載下傳源碼xlsx.full.min.js
完整代碼
<html hljs-string">"en">
<title> Convert Excel File To JSON </title>
<head>
<script src="js/jquery.js"> </script>
<script hljs-string">"javascript" src="js/xlsx.full.min.js"></script>
<script>
$(document).ready(function(){
$("#fileUploader").change(function(evt){
var selectedFile = evt.target.files[0];
var reader = new FileReader();
reader.onload = function(event) {
var data = event.target.result;
var workbook = XLSX.read(data, {
type: 'binary'
});
workbook.SheetNames.forEach(function(sheetName) {
var XL_row_object = XLSX.utils.sheet_to_row_object_array(workbook.Sheets[sheetName]);
if (XL_row_object.length > 0) {
document.getElementById("jsonObject").innerHTML = JSON.stringify(XL_row_object);
}
})
};
reader.onerror = function(event) {
console.error("File could not be read! Code " + event.target.error.code);
};
// 讀取上傳檔案為二進制
reader.readAsBinaryString(selectedFile);
});
});
</script>
</head>
<body>
<input type="file" id="fileUploader" name="fileUploader" accept=".xls, .xlsx"/>
</br></br>
JSON : <label id="jsonObject"> </label>
</body>
複制代碼
作為示例，我們使用如下的excel表格。
讀出json資料如下
大功告成！！！
SheetJS 還有很多實用的功能，具體更多功能請自行去github檢視githu位址
示範源碼位址code
轉載于:https://juejin.im/post/5d0105c7e51d45105e0212a4
![Javascript建構Bingo卡片遊戲[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)