Html - Json转excel文件
生活随笔
收集整理的這篇文章主要介紹了
Html - Json转excel文件
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
Html - Json轉excel文件
Max.Bai
2020-08
?
工作中常需要將json文件轉換成excel文件，下面的代碼復制保存為html后綴，直接就是一個轉換工具了。
?
<html> <header><script src="https://unpkg.com/xlsx@0.16.3/dist/xlsx.full.min.js"></script> </header><body><span>Step1: 上傳json文件，最外層是list</span><br /><br /><input type='file' onchange='importDataSource(this)' /><br /><p> 文件內容Demo:[{"key_as_string":"2020-06-30T00:00:00.000Z","key":1593475200000,"doc_count":1},{"key_as_string":"2020-06-30T01:00:00.000Z","key":1593478800000,"doc_count":3}]</p><hr /><p>Step2: 下載文件</p><button type="button" onclick="json2Excel()">點擊下載</button><script>// Max.Bai// 2020-08var dataSource = null;var fileName = '';//1、importDataSource() 方法用來獲取json數據function importDataSource(obj) {//2、obj.files[0]獲得onchange文件，name獲得文件名作為Excel的文件名fileName = obj.files[0].name.split('.')[0];//3、創建FileReader對象，將文件內容讀入內存，通過一些api接口，可以在主線程中訪問本地文件var reader = new FileReader();//4、readAsText(file) 異步按字符讀取文件內容，結果用字符串形式表示reader.readAsText(obj.files[0]);var that = this//5、onload事件，當讀取操作成功完成時調用reader.onload = function () {//讀取完畢后輸出結果 為字符串 此時需要轉成json對象that.dataSource = JSON.parse(this.result)alert("上傳成功");}}var wopts = {bookType: 'xlsx',bookSST: false,type: 'binary'};var workBook = {SheetNames: ['Sheet1'],Sheets: {},Props: {}};function json2Excel() {//1、XLSX.utils.json_to_sheet(data) 接收一個對象數組并返回一個基于對象關鍵字自動生成的“標題”的工作表，默認的列順序由使用Object.keys的字段的第一次出現確定//2、將數據放入對象workBook的Sheets中等待輸出workBook.Sheets['Sheet1'] = XLSX.utils.json_to_sheet(dataSource)//3、XLSX.write() 開始編寫Excel表格//4、changeData() 將數據處理成需要輸出的格式saveAs(new Blob([changeData(XLSX.write(workBook, wopts))], { type: 'application/octet-stream' }))}function changeData(s) {//如果存在ArrayBuffer對象(es6) 最好采用該對象if (typeof ArrayBuffer !== 'undefined') {//1、創建一個字節長度為s.length的內存區域var buf = new ArrayBuffer(s.length);//2、創建一個指向buf的Unit8視圖，開始于字節0，直到緩沖區的末尾var view = new Uint8Array(buf);//3、返回指定位置的字符的Unicode編碼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;}}function saveAs(obj, fileName) {//當然可以自定義簡單的下載文件實現方式 console.log("save")var tmpa = document.createElement("a");tmpa.download = fileName || "result.xlsx";tmpa.href = URL.createObjectURL(obj); //綁定a標簽tmpa.click(); //模擬點擊實現下載setTimeout(function () { //延時釋放URL.revokeObjectURL(obj); //用URL.revokeObjectURL()來釋放這個object URL}, 100);}</script> </body></html>?
總結
以上是生活随笔為你收集整理的Html - Json转excel文件的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： hive 语句总结_Hive常用命令总结
- 下一篇： python编程格式化输出_Python