网站首页 > 技术文章 正文
1.File文件对象:
文件上传时,上传的数据对象就是File文件对象。
此对象包括以下几个属性:
lastModified:文件的最后修改时间戳
lastModifiedDate:文件的最后修改时间对象
name: 文件名
size: 文件大小
type:文件类型
webkitRelativePath: File 相关的 path 或 URL
2.FormData表单数据对象
常用方法:
append:添加属性
delete:删除属性
entries: 获取键值的数组
forEach: 遍历对象属性
get: 获取某个属性的值
getAll: ? getAll()
has: 是否有某个属性
keys: 返回所有key的数组
set: 设置某个属性的值
values: 返回所有value的数组
3.Blob对象表示一个不可变、原始数据的类文件对象。
它的数据可以按文本或二进制的格式进行读取,也可以转换成 ReadableStream 来用于数据操作。
arrayBuffer:
返回一个promise且包含blob所有内容的二进制格式的 ArrayBuffer
size:
blob对象中所包含数据的大小(字节)
slice:
返回一个新的 Blob 对象,包含了源 Blob 对象中指定范围内的数据
stream:
返回一个能读取blob内容的 ReadableStream
text:
返回一个promise且包含blob所有内容的UTF-8格式的 USVString
type:
一个字符串,表明该 Blob 对象所包含数据的 MIME 类型。如果类型未知,则该值为空字符串
4.FileReader
FileReader对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用 File 或 Blob 对象指定要读取的文件或数据。
属性,方法如下:
DONE: 2 已完成全部的读取请求.
EMPTY: 0 还没有加载任何数据.
LOADING: 1 数据正在被加载.
abort:
中止读取操作。在返回时,readyState属性为DONE
error:
开始读取指定的 Blob中的内容, 一旦完成, result 属性中保存的将是被读取文件的 ArrayBuffer 数据对象.
onabort:
处理abort (en-US)事件。该事件在读取操作被中断时触发
onerror:
处理error (en-US)事件。该事件在读取操作发生错误时触发
onload:
处理load (en-US)事件。该事件在读取操作完成时触发
onloadend:
处理loadend (en-US)事件。该事件在读取操作结束时(要么成功,要么失败)触发
onloadstart:
处理loadstart (en-US)事件。该事件在读取操作开始时触发
onprogress:
处理progress (en-US)事件。该事件在读取Blob时触发。
readAsArrayBuffer:
开始读取指定的 Blob中的内容, 一旦完成, result 属性中保存的将是被读取文件的 ArrayBuffer 数据对象.
readAsBinaryString:
开始读取指定的Blob中的内容。一旦完成,result属性中将包含所读取文件的原始二进制数据。
readAsDataURL:
开始读取指定的Blob中的内容。一旦完成,result属性中将包含一个data: URL格式的Base64字符串以表示所读取文件的内容。
readAsText:
开始读取指定的Blob中的内容。一旦完成,result属性中将包含一个字符串以表示所读取的文件内容。
readyState:
表示FileReader状态的数字。取值如下:
常量名 值 描述
EMPTY 0 还没有加载任何数据.
LOADING 1 数据正在被加载.
DONE 2 已完成全部的读取请求.
result: 文件的内容
5.URL对象
hash:
包含'#'的USVString,后跟URL的片段标识符
host:
一个USVString,其中包含域(即主机名),后跟(如果指定了端口)“:”和URL的端口。
hostname:
包含 URL 域名的 USVString。
href:
包含完整 URL 的 USVString。
origin:
返回一个包含协议名、域名和端口号的 USVString。
password:
包含在域名前面指定的密码的 USVString 。
pathname:
以 '/' 起头紧跟着 URL 文件路径的 DOMString。
port:
包含 URL 端口号的 USVString。
protocol:
包含 URL 协议名的 USVString,末尾带 ':'。
search:
一个USVString ,指示URL的参数字符串; 如果提供了任何参数,则此字符串包括所有参数,并以开头的“?”开头 字符。
searchParams:
URLSearchParams对象,可用于访问search中找到的各个查询参数。
username:
包含在域名前面指定的用户名的 USVString。
方法
toString()
返回包含整个URL的USVString。 它是URL.href的同义词,尽管它不能用于修改值。
toJSON()
返回包含整个URL的USVString。 它返回与href属性相同的字符串。
静态方法:
createObjectURL()
返回一个DOMString ,包含一个唯一的blob链接(该链接协议为以blob:,后跟唯一标识浏览器中的对象的掩码)。
revokeObjectURL()
销毁之前使用URL.createObjectURL()方法创建的URL实例。
猜你喜欢
- 2024-11-13 JS二进制:Blob、File、FileReader、ArrayBuffer、Base64
- 2024-11-13 实现HTML5网站中常见的拖拽上传文件
- 2024-11-13 input上传图片并压缩(vue,前端,js)
- 2024-11-13 怎样用Nodejs,Express和FFmpeg.wasm构建一个处理多媒体的API
- 2024-11-13 为什么 JS 开发者更喜欢 Axios 而不是 Fetch?
- 2024-11-13 leaflet地图截图批量导出 leaflet 底图
- 2024-11-13 拖拽外部文件进行读取-FileReader
- 2024-11-13 JavaScript `FileReader` 接口提供的文件处理方法
- 2024-11-13 vue手把手教学~搭建web聊天室 vue实现聊天功能
- 2024-11-13 Html5 上传图片 移动端、PC端通用
- 标签列表
-
- content-disposition (47)
- nth-child (56)
- math.pow (44)
- 原型和原型链 (63)
- canvas mdn (36)
- css @media (49)
- promise mdn (39)
- readasdataurl (52)
- if-modified-since (49)
- css ::after (50)
- border-image-slice (40)
- flex mdn (37)
- .join (41)
- function.apply (60)
- input type number (64)
- weakmap (62)
- js arguments (45)
- js delete方法 (61)
- blob type (44)
- math.max.apply (51)
- js (44)
- firefox 3 (47)
- cssbox-sizing (52)
- js删除 (49)
- js for continue (56)
- 最新留言
-