龙空技术网

采用HTML5进行本地文件的操作

子墨爸爸 329

前言:

今天大家对“html5传输数据”都比较讲究,大家都需要分析一些“html5传输数据”的相关内容。那么小编在网上收集了一些关于“html5传输数据””的相关内容,希望各位老铁们能喜欢,我们一起来了解一下吧!

HTML5的标准文件Api可以使用页面具有文件传输的能力,其定义如下四个接口:

BLOB - 不改变变的原始数据。一个Blob类型属性,显示数据的媒体类型,如“text /平原”。

File - 继承自BLOB,表示一个单独的文件

FileList - 文件对象集合

FileReader - 读物文件或者BLOB的内容

FileRead提供了三个方法用于读取文件内容

readAsText() -读取文件或者BLOB对象将其内容转换为可读的文本内容。

readAsDataURL() -取文件或者BLOB对象将其内容转换为一个Data Url,可用于图片的现实。

readAsArrayBuffer() - 取文件或者BLOB对象将其内容转换为ArrayBuffer

FileReader实现一部读取并且能够展示读取内容的进度,可以实现如文件上传的进度条的接口。

load加载事件-数据已经成功加载

abort终止事件-数据加载过程被终止

error事件-加载过程出错

loadend事件-加载结束

下面是一个读物文件内容的实例

采用input type='filed"控件获取文件或者Blob对象

创建FileReader对象,实现加载过程的控制

FileReader调用readAsText()方法

errror事件实现出错信息的展示

标签: #html5传输数据