之前一直觉得h5的新特性就是一些新标签呢,直到想研究一下图片上传预览的原理,才发现还是有好多新的api的,只是不兼容ie低版本,挺可惜的,

  File API在表单中文件输入字段基础上,又添加了一些直接访问文件信息的接口。H5在DOM中为文件输入元素添加了一个files集合,在通过表单元素选择了一个或多个文件时,files集合中将包含一组file对象,每个file对象对应一个文件,每个file对象都有下列只读属性:

  1、name:本地文件系统的文件名;

  2、size:文件的字节大小;

  3、type:字符串,文件的MIME类型;

  4、lastModifiedDate:字符串,文件上一次被修改的事件,(只有chrome实现了这个属性)

  例子:

  现在我们获取id为“files-list”的input,type为file,的元素,将该元素上传的文件输出到控制台:

FileReader类型:

  FileReader类型实现的是一种异步的文件读取机制,可以把fileReader想象成XMLHttpResquest,区别就是FileReader读取的是文件,而不是远程服务,为了读取文件中的数据,FileReader提供了如下几种方法:

  1、readAsTxt,以纯文本的形式读取文件,将读取到的文件保存到result属性中;

  2、readAsDataURL,读取文件,并将文件数据URL保存到result属性中;

  3、readAsArrayBuffer,读取文件,并将

没写完呢,放假回家

h5新特性 File API详解的更多相关文章

  1. Swift 3 新特性和迁移详解

    写在前面 Swift 3.0 正式版发布了差不多快一个月了,断断续续的把手上和 Swift 相关的迁移到了Swift 3.0.所以写点小总结. 背景 代码量(4万行) 首先,我是今年年初才开始入手 S ...

  2. IOS6 新特性之UIActivityViewController详解

    新的IOS6增加了一些新特性.因为应用需要,所以在国庆的几天里.研究了一下IOS6的说明文档,然后大概地总结了一下UIActivityViewController的用法与大家分享. 首先 从实际效果入 ...

  3. Android新特性Instant Run详解

    关于 Instant Run Android Studio 2.0 中引入的 Instant Run 是 Run 和 Debug 命令的行为,可以大幅缩短应用更新的时间.尽管首次构建可能需要花费较长的 ...

  4. java8 array、list操作 汇【3】)(-Java8新特性之Collectors 详解

    //编写一个定制的收集器 public static class MultisetCollector<T> implements Collector<T, Multiset<T ...

  5. [C++11新特性] 智能指针详解

    动态内存的使用很容易出问题,因为确保在正确的时间释放内存是极为困难的.有时我们会忘记释放内存产生内存泄漏,有时提前释放了内存,再使用指针去引用内存就会报错. 为了更容易(同时也更安全)地使用动态内存, ...

  6. Spring Boot 2.3 新特性优雅停机详解

    什么是优雅停机 先来一段简单的代码,如下: @RestController public class DemoController { @GetMapping("/demo") p ...

  7. H5新特性---SVG--椭圆--直线--文本--滤镜(高斯滤镜--模糊)--地理定位

    今天的目标 3.1:h5新特性--SVG--椭圆 <ellipse rx="" ry=""  cx="" cy="" ...

  8. 【repost】H5的新特性及部分API详解

    h5新特性总览 移除的元素 纯表现的元素: basefont.big.center.font等 对可用性产生负面影响的元素: frame.frameset.noframes 新增的API 语义: 能够 ...

  9. Java8学习笔记(五)--Stream API详解[转]

    为什么需要 Stream Stream 作为 Java 8 的一大亮点,它与 java.io 包里的 InputStream 和 OutputStream 是完全不同的概念.它也不同于 StAX 对 ...

随机推荐

  1. tomcat 测试页面显示

    首先下载匹配jdk版本的tomcat 解压即可使用 将完成的html文件直接放置到webapps目录下的子目录中是无法使用的 原因是tomcat默认加载的是jsp文件,且需要文件配置 所以,除去在we ...

  2. Linux vi 文件编辑

    1.通过vi filename 进入编辑状态 2.退出 vi 编辑器 退出命令 说明 q 如果文件未被修改,会直接退回到Shell:否则提示保存文件. q! 强行退出,不保存修改内容. wq w 命令 ...

  3. mongodb性能问题及原理分析

    近期忙着把一个项目从MySQL迁移到MongoDB,在导入旧数据的过程中.遇到了些许波折,犯了不少错误,但同一时候也学到了不少知识,遂记录下来. 公司为这个项目专门配备了几台高性能务器,清一色的双路四 ...

  4. C#调用python脚本

    因项目需要,需要使用C#控制台程序执行python脚本,查询各种资料后可以成功调用了,记录一下,以备后面遗忘. 只尝试了两种调用方式,第一种只适用于python脚本中不包含第三方模块的情况,第二种针对 ...

  5. poj 1041(欧拉回路+输出字典序最小路径)

    题目链接:http://poj.org/problem?id=1041 思路:懒得写了,直接copy吧:对于一个图可以从一个顶点沿着边走下去,每个边只走一次,所有的边都经过后回到原点的路.一个无向图存 ...

  6. PMP杂谈--项目组织,矩阵组织,职能型组织,复合型组织

    (1)项目组织的优缺点:优:项目经理权力大:缺:解散时焦虑.没有提拔权力,不利于专业技术积累,设备反复.难以保证资源的充分利用. (2)矩阵组织的优缺点:优:资源利用率高,横向信息沟通.项目经理权力提 ...

  7. java API Runtime 启动进程

    Runtime run = new Runtime.getRuntime(); Process p = run.exec("notepad.exe F:\\lesson\\a.java&qu ...

  8. h5做移动应用开发部分技巧

    1.使用多种分别率设备:利用viewport标签<meta name="viewport" content="width=device-width, initial ...

  9. Java数据类型的转换:隐式(自动)转换与强制转换

    原文链接:http://java.chinaitlab.com/base/725590.html 一些初学JAVA的朋友可能会遇到JAVA的数据类型之间转换的苦恼,例如,整数和float,double ...

  10. 【BZOJ2803】[Poi2012]Prefixuffix 结论题

    [BZOJ2803][Poi2012]Prefixuffix Description 对于两个串S1.S2,如果能够将S1的一个后缀移动到开头后变成S2,就称S1和S2循环相同.例如串ababba和串 ...