使用xlsx 实现纯前端的上传excel，并解析显示

传统意义上的，如果我们需要上传excel文件后显示到前端页面，需要我们上传给后台，然后后台进行数据解析，再把数据返回给前端，前端在页面显示内容。这无疑很浪费时间，本次尝试使用xlsx.js进行上传，前端可以自己进行数据解析。

我们可以看到官网文档中，提供了一下几个方式的例子

1. node readFile
   
2. ajax (for a more complete example that works in older browsers, check the demo at http://oss.sheetjs.com/js-xlsx/ajax.html)
   
3. HTML5 drag-and-drop using readAsBinaryString
   
4. HTML5 input file element using readAsBinaryString

function handleFile(e) {
  var files = e.target.files;
  var i,f;
  for (i = 0, f = files[i]; i != files.length; ++i) {
    var reader = new FileReader();
    var name = f.name;
    reader.onload = function(e) {
      var data = e.target.result;

      var workbook = XLSX.read(data, {type: 'binary'});

      /* DO SOMETHING WITH workbook HERE */
    };
    reader.readAsBinaryString(f);
  }
}
input_dom_element.addEventListener('change', handleFile, false);

根据以上例子，我们可以继续进行

html

<input type="file" accept=" application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" id="upload_excel"/>

<div id="content">