7. 文件 API

7.1. 读取本地文件信息

文件域对象可以获取用户选择文件的信息:

  • 文件名
  • 最近修改时间
  • 文件大小
  • 文件类型
var input = document.querySelector('#input_1');
var file = input.files[0];
file.name              // 获取文件名
file.lastModifiedDate  // 获取最近修改时间
file.size              // 获取文件大小(单位KB)
file.type              // 获取文件类型(如:text/plain、image/png)

7.2. 文件域改变事件

7.3. 文件域样式

7.4. 使用FileReader读取文件内容

FileReader就是用来读取本地文件的对象

var reader = new FileReader();
reader.addEventListener('load', function () {
    this.result; // 读取出来的结果
});
reader.readAsText(file);     // 以文本的形式读取
reader.readAsDataURL(file);  // 以DataURI的形式读取
// 以下(后台工程师用,前端不会用到)
reader.readAsBinaryString(file); // 二进制格式
reader.readAsArrayBuffer(file);  // 字节数组
Logo

CSDN联合极客时间,共同打造面向开发者的精品内容学习社区,助力成长!

更多推荐