js读取文件

js读取文件的 *** 作是什么样的呢？一起来看下吧：

1、js读取文件；

/**      慧族* 上传图片      * @param file 传入获取的文件      * @author wangzhen 2018-09-07     */     function loadImg(file,callback){         //创建读取文件的对象         var reader = new FileReader()           //创建文件读取相关的变量         var imgFile           //为文件读取成功设置事件         reader.onload=function(e) {             // console.log('文件读取完成')             imgFile = e.target.result             // console.log(imgFile)             // $("#imgLicense").attr('src', imgFile)             // callback(imgFile)             callback(file)         }           //正式读取文件         reader.readAsDataURL(file)     }

2、将以base64的图片url数据转换为Blob； // -------- 将以base64的图片url数据转换为Blob --------     function convertBase64UrlToBlob(urlData, filetype){         //去掉url的头，并转换为byte         var bytes = window.atob(urlData.split(',')[1])                  //处理异常,将ascii码小于0的转换为大于0         var ab = new ArrayBuffer(bytes.length)    前粗弊     var ia = new Uint8Array(ab)         var i      凳斗   for (i = 0 i 

刚好有个介绍filesystem的就有你这个功能：

<p>

从www.html5rocks.com/zh/tutorials/file/dndfiles

中间“分割文件”部分摘过来的，他是分别读取的1-5,6-15,7-8字节的数据，可以参考一下，很裤唯容易改成连续读取8个字节的，你懂的

</p>

<style>

  #byte_content {

    margin: 5px 0

    max-height: 100px

    overflow-y: auto

    overflow-x: hidden

  }

  #byte_range { margin-top: 5px }

</style>

<input type="file" id="files" name="file" /> Read bytes: 

<span class="readBytesButtons">

  <button data-startbyte="0" data-endbyte="4">1-5</button>

  <button data-startbyte="5" data-endbyte="14">6-15</button>

  <button data-startbyte="6" data-endbyte="7">7-8</button>

  <button>entire file</button>

</span>

<div id="byte_range"></div>

<div id="byte_content"></div>

<script>

  function readBlob(opt_startByte, opt_stopByte) {

    var files = document.getElementById('files').files

    if (!files.length) {

      alert('Please select a file!')

      return

    }

    var file = files[0]

    var start = parseInt(opt_startByte) || 0

    var stop = parseInt(opt_stopByte) || file.size - 1

    var reader = new FileReader()

    // If we use onloadend, we need to check the readyState.

    reader.onloadend = function(evt) {

      if (evt.target.readyState == FileReader.DONE) { // DONE == 2

        document.getElementById('byte_content').textContent = evt.target.result

 洞没       document.getElementById('byte_range').textContent = 

            ['Read bytes: ', start + 1, ' - ', stop + 1,

             ' of ', file.size, ' byte file'].join(''胡颤培)

      }

    }

    if (file.webkitSlice) {

      var blob = file.webkitSlice(start, stop + 1)

    } else if (file.mozSlice) {

      var blob = file.mozSlice(start, stop + 1)

    }

    reader.readAsBinaryString(blob)

  }

  

  document.querySelector('.readBytesButtons').addEventListener('click', function(evt) {

    if (evt.target.tagName.toLowerCase() == 'button') {

      var startByte = evt.target.getAttribute('data-startbyte')

      var endByte = evt.target.getAttribute('data-endbyte')

      readBlob(startByte, endByte)

    }

  }, false)

</script>

---