1.FileList对象与File对象

2.文件API之Bolb对象

A Blob object represents a file-like object of immutable, raw data. Blobs represent data that isn't necessarily in a JavaScript-native format. The File interface is based on Blob, inheriting blob functionality and expanding it to support files on the user's system.

To construct a Blob from other non-blob objects and data, use the Blob() constructor. To create a blob that contains a subset of another blob's data, use the slice() method. To obtain a Blob object for a file on the user's file system, see the File documentation.

The APIs accepting Blob objects are also listed on the File documentation.

Constructor
Blob(blobParts[, options])
Returns a newly created Blob object whose content consists of the concatenation of the array of values given in parameter.
Properties
Blob.isClosed Read only
A boolean value, indicating whether the Blob.close() method has been called on the blob. Closed blobs can not be read.
Blob.size Read only
The size, in bytes, of the data contained in the Blob object.
Blob.type Read only
A string indicating the MIME type of the data contained in the Blob. If the type is unknown, this string is empty.
Methods
Blob.close()
Closes the blob object, possibly freeing underlying resources.
Blob.slice([start[, end[, contentType]]])
Returns a new Blob object containing the data in the specified range of bytes of the source Blob.
Examples
Blob constructor example usage

The Blob() constructor allows one to create blobs from other objects. For example, to construct a blob from string:

var debug = {hello: "world"};
var blob = new Blob([JSON.stringify(debug, null, 2)], {type : 'application/json'});
Before the Blob constructor was available, this could be accomplished through the BlobBuilder API, which is now deprecated:

var builder = new BlobBuilder();
var fileParts = ['<a id="a"><b id="b">hey!</b></a>'];
builder.append(fileParts[0]);
var myBlob = builder.getBlob('text/xml');
Example for creating a URL to a typed array using a blob

The following code:

var typedArray = GetTheTypedArraySomehow();
var blob = new Blob([typedArray], {type: 'application/octet-binary'}); // pass a useful mime type here
var url = URL.createObjectURL(blob);
// url will be something like: blob:d3958f5c-0777-0845-9dcf-2cb28783acaf
// now you can use the url in any context that regular URLs can be used in, for example img.src, etc.
Example for extracting data from a Blob

The only way to read content from a Blob is to use a FileReader. The following code reads the content of a Blob as a typed array.

var reader = new FileReader();
reader.addEventListener("loadend", function() {
// reader.result contains the contents of blob as a typed array
});
reader.readAsArrayBuffer(blob);
By using other methods of FileReader, it is possible to read the contents of a Blob as a string or a data URL.

间断上传文件的格式

3.文件API之FileReader对象

http://blog.csdn.net/zk437092645/article/details/8745647

HTML5 文件API(一)的更多相关文章

  1. 用html5文件api实现移动端图片上传&预览效果

    想要用h5在移动端实现图片上传&预览效果,首先要了解html5的文件api相关知识(所有api只列举本功能所需): 1.Blob对象  Blob表示原始二进制数据,Html5的file对象就继 ...

  2. HTML5文件API之FileReader

    在文件上传之前,我们总想预览一下文件内容,或图片样子,html5 中FileReader正好提供了2种方法,可以在不上传文件的情况下,预览文件内容. 图片预览:readAsDataURL(file); ...

  3. HTML5文件API

    File对象与File对象 Blob对象 FileReader对象 File对象 <!DOCTYPE html> <html> <head> <meta ht ...

  4. HTML5 文件API(二)

    1.FileSystem概述及浏览器检 2.申请磁盘配额 3.创建文件

  5. HTML5 文件API

    filelist 表示文件对象的列表. <form name="upload"> <input type="file" name=" ...

  6. Resumable.js – 基于 HTML5 File API 的文件上传

    Resumable.js 是一个 JavaScript 库,通过 HTML5 文件 API 提供,稳定和可恢复的批量上传功能.在上传大文件的时候通过每个文件分割成小块,每块在上传失败的时候,上传会不断 ...

  7. HTML5权威指南--标签新变化,文件API,拖放API(简要学习笔记一)

    1.标签元素更加语义化   2.内容类型仍然为“text/html”    扩展符仍然为html或者htm.    <1>DOCTYPE 声明<!DOCTYPE html>就可 ...

  8. HTML5 File API — 让前端操作文件变的可能

    前言 在 HTML5 File API 出现之前,前端对于文件的操作是非常有局限性的,大多需要配合后端实现.出于安全角度考虑,从本地上传文件时,代码不可能获取文件在用户本地的地址,所以纯前端不可能完成 ...

  9. HTML5 file api读取文件的MD5码工具

    1.工具的用途:用HTML5 file api读取文件的MD5码.MD5码在文件的唯一性识别上有很重要的应用,业内常用MD5进行文件识别.文件秒传.文件安全性检查等: 2.适用性:IE.Chrome皆 ...

随机推荐

  1. 51nod贪心算法入门-----完美字符串

    约翰认为字符串的完美度等于它里面所有字母的完美度之和.每个字母的完美度可以由你来分配,不同字母的完美度不同,分别对应一个1-26之间的整数. 约翰不在乎字母大小写.(也就是说字母F和f)的完美度相同. ...

  2. 分享:PHP数组排序总结

    本文内容:PHP二维数组排序,PHP数组排序总结. php数组排序是PHP学习中最基础也是最重要的一部分. 1.常规数组的排序 常规数组是指数组各元素均为字符串或数字,这与这样的数组,我们可以采用so ...

  3. 2013-07-23 IT 要闻速记快想

    ### ========================= ###苹果的新动向今天华尔街日报称,苹果正在测试13英寸的大号iPad,以及更大屏幕的iPhone.而早在五月份,韩国资讯网站 ET New ...

  4. Jquery LigerUI框架学习(一)

    ligerUI框架是一个很丰富的后台框架模板,具有简洁大方的后台样式框架,还有很多灵活的控件,方便开发人员使用: 把昨天学习的成功拿出来供大家学习学习: 首先我们要去ligerUI官网下载Jquery ...

  5. Java从入门到精通——技巧篇之利用dom4j取出XML文件中的数据

    在我们做项目的时候会经常用到XML文件用来配置系统,XML让系统更加的具有了灵活性,Java如何从XML中取出我们想要的数据呢?下面是我利用DOM4J来实现取出XML文件中的数据. XML文件 < ...

  6. 通过keepalived实现 MySQL VIP 自动切换

    首先配置keepalived.链接如下:http://blog.itpub.net/28939273/viewspace-1808369/ 主服务器keepalived的配置文件内容如下: [root ...

  7. 调皮的转义之addslashes

    背景: php自5.3版本开始废除set_magic_quotes_runtime函数,并在5.4及以后版本中移除了该函数 今天程序在向mysql插入一个serialize序列化后的数组时,由于一个数 ...

  8. POJ 2315 最小费用最大流

    从1走到N然后从N走回来的最短路程是多少? 转换为费用流来建模. 1: /** 2: 因为e ==0 所以 pe[v] pe[v]^1 是两条相对应的边 3: E[pe[v]].c -= aug; E ...

  9. KVM通过qemu实现USB重定向

    KVM是通过qemu来支持USB设备的,可以在启动的时候就指定需要连接的USB设备,也可以系统启动后动态的添加删除.通过qemu的help可知,使用qemu的usb_add host:xxx:xxx来 ...

  10. 为什么使用long声明和double声明得到的结果不一样呢?

    为什么使用long声明和double声明得到的结果不一样呢? 程序如下: public class P376{ public static void main(String[] atgs){ long ...