溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
前言
JSON是碼農(nóng)們常用的數(shù)據(jù)格式，輕且方便，而直接手敲JSON卻是比較麻煩和令人心情崩潰的（因為重復的東西很多），所以很多碼農(nóng)可能會和我一樣，選擇用Excel去輸入數(shù)據(jù)，然后再想辦法轉換成JSON格式。今天教大家使用JS 將 Excel 轉為 JSON的方法。
1.新建HTML文件
<html lang="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.監(jiān)聽input change 事件
<script>
$(document).ready(function(){
$("#fileUploader").change(function(evt){
// 上傳文件處理邏輯...
});
});
</script>
3.讀取上傳文件
在這里，我們假設用戶只上傳一個文件。
var selectedFile = evt.target.files[0];
接下來，我們將使用FileReader讀取該文件數(shù)據(jù)。從這個FileReader，我們可以讀取excel文件中的數(shù)據(jù)作為二進制字符串。然后我們使用XLSX，它是SheetJS js-xlsx的內(nèi)置工具，將我們的二進制字符串轉換為JSON對象。引入 XLSX
<script lang =“javascript”src =“dist/xlsx.full.min.js”> </ script>
您可以下載源碼xlsx.full.min.js
完整代碼
<html lang="en">
<title> Convert Excel File To JSON </title>
<head>
<script src="js/jquery.js"> </script>
<script lang="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數(shù)據(jù)如下
大功告成?。?！
SheetJS 還有很多實用的功能，具體更多功能請自行去github查看githu地址
演示源碼地址code
總結
以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學習或者工作具有一定的參考學習價值，謝謝大家對億速云的支持。
免責聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權內(nèi)容。
