js-XMLHttpRequest 2级
###1. XMLHttpRquest 2级
1) FormData
现代web应用中频繁使用的一项功能就死表单数据的序列化, XMLHttpRquest 2级为此定义了FormData类型
FormData为序列化表单以及创建于表单格式相同数据(用于通过XHR传输)提供了便利
eg: var data = new FormData();
data.append("name","Tom") // append(键 , 值)
在post请求表单提交数据时,可直接使用该方法对表单数据进行处理
eg: var form = document.getElementById("user-info") // id为user-info的form表单
xhr.send(new FormData(form))
2) 超时设定 timeout属性,表示请求在等待响应多少毫秒之后就终止,触发该事件后会调用ontimeout事件处理程序
eg: xhr.timeout = 1000; // 将超时设置为1s
xhr.ontimeout = function(){
alert("Request did not return in a second"); // 输出“请求没有立即返回”
}
3) overrideMimeType() 用于重写XHR响应的MIME类型
4)进度事件
6中进度事件
loadstart: 在接受到相应数据的第一个字节是触发
progress: 在接受响应期间持续不断触发
error: 在请求发生错误时
abort: 调用abort() 触发
load: 在接收到完整的响应数据是触发
loadend: 在通信完成或触发error·abort或load事件后触发
4.1) load事件
用以替代readystatechange事件,响应接受完毕后将触发load事件,因此也没有必要去检查readyState属性。
而onload事件处理程序会接收到一个event对象,其target属性就指向xhr对象实例,可以访问到XHR对象的所有方法和属性
4.2)progress事件
会接收到一个event对象,其target属性是XHR对象,但包含着三个额外的属性
lengthComputable 表示进度信息是否可用的布尔值
position 表示已经接受的字节数
totalSize 表示根据Content-Length 响应头部确认的预期字节数
可以根据这些信息为用户创建一个进度指示器 为确保正常执行,必须在调用open方法之前添加该事件处理程序
eg:
xhr.onprogress = function(event){
var obj = document.getElementById("xxx");
if(event.lengthComputable){
obj.innerHTML = "Received" + event.position + "of" + event.totalSize + "bytes" // 收到了xxx字节中的xxx个
}
}
js-XMLHttpRequest 2级的更多相关文章
- 6个函数的output看JS的块级作用域
1. var output = 0; (function() { output++; }()); console.log(output); 函数对全局的output进行操作,因为JS没有块级作用域,所 ...
- js有块级作用域么?
//js私有作用域,js没有块级作用域 function Box(){ for(var i=0;i<5;i++){} console.log(i);//5,如果js有块级作用域,那么i在for循 ...
- js模仿块级作用域(js没有块级作用域私有作用域)
js模仿块级作用域(js没有块级作用域私有作用域) 一.总结 1.js没有块级作用域:在for循环中定义的i,出了for循环还是有这个i变量 2.js可以模拟块级作用域:用立即执行的匿名函数:(匿名函 ...
- 【分享】纯js的n级联动列表框 —— 基于jQuery,支持下拉列表框和列表框,最重要的是n级,当然还有更重要的
多个列表框联动,不算是啥大问题,但是却挺麻烦,那么怎么才能够尽量方便一点呢?网上搜了一下,没发现太好用的,于是就自己写了一个.基于jQuery,无限级联动,支持下拉列表框和列表框. 先说一下步骤和使用 ...
- JS的块级作用域
今天带来的是 "对<你不知道的js>中块级作用域的总结" 分享: 1)用with从对象中创建出来的作用域只在with声明中而非外部作用域有效,同时可以访问已有对象的属性 ...
- JS 模仿块级作用域
function outputNumbers(count) { for (var i=0; i<count; i++) { console.log(i); } var i; // 重新声明变量 ...
- 纯js的N级联动列表框 —— 基于jQuery
多个列表框联动,不算是啥大问题,但是却挺麻烦,那么怎么才能够尽量方便一点呢?网上搜了一下,没发现太好用的,于是就自己写了一个.基于jQuery,无限级联动,支持下拉列表框和列表框. 先说一下步骤和使用 ...
- JS XMLHttpRequest.upload.addEventListener 传参,回调
JS 回调函数,传参的办法. function uploadFile(t) { var fd = new FormData(); fd.append("_netLogo", doc ...
- JS XMLHttpRequest请求
前言 我们知道jq的请求非常简短好用,但是其实js原生的请求也不差,并且不用插件更能说明自己本身的技术已经很强了,别人看自己代码一脸懵逼的时候,这时就可以一一解释这些代码的用处,更能让别人敬佩! JS ...
- JS获取节点的兄弟,父级,子级元素的方法(js获取子级获取到换行与空格元素-FF)
先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作对比. JS的方法会比JQUERY麻烦很多,主要则是因为FF浏览器,FF浏览器会把你的换行也当最DOM元素 < ...
随机推荐
- Spring的事务管理1
事务的回顾: 事务:逻辑上的一组操作,组成这组事务的各个单元,要么全部成功,要么全部失败 事务的特性:ACID 原子性(Atomicity):事务不可分割 一致性(Consistency):事务执行前 ...
- 【C编程基础】多线程编程
基础知识 1.基本概念 (1)线程,即轻量级进程(LWP:LightWeight Process),是程序执行流的最小单元. 线程是进程中的一个实体,是被系统独立调度和分派的基本单位. (2)线程同步 ...
- 【汤鸿鑫 3D太极】5年目标规划(基本功、套路、实战搏击)
[5年目标]在基本功的基础上,每年完成一个套路或实战搏击的学习研究. [中小学2年]三段九节 + 2套路. [高中的3年]太极十三势 + 1套路 + 推手 + 搏击. 1.中小学阶段-可自学 (1)基 ...
- aliyun mysql
https://segmentfault.com/q/1010000009603559?sort=created
- ccf 再买菜 搜索 dfs
//递推关系式:(b[n-1]+b[n]+b[n+1])/3=a[n] //所以b[n+1]=3*a[n]-b[n-1]-b[n],或b[n+1]=3*a[n]-b[n-1]-b[n]+1,或b[n+ ...
- Matplotlib 绘图 用法
Matplotlib基础知识 一.Matplotlib基础知识 Matplotlib中的基本图表包括的元素 x轴和y轴 axis 水平和垂直的轴线 x轴和y轴刻度 tick 刻度标示坐标轴的分隔,包括 ...
- 设计模式のFacadePattern(外观模式)----结构模式
一.产生背景 外观模式(Facade Pattern)隐藏系统的复杂性,并向客户端提供了一个客户端可以访问系统的接口.这种类型的设计模式属于结构型模式,它向现有的系统添加一个接口,来隐藏系统的复杂性. ...
- centos7下安装docker(17docker监控---docker自带监控命令)
Docker自带的监控子命令 1.docker ps:docker ps -a这是我们常用的查看容器状态的命令 docker container ls和docker ps的功能一样 2.docker ...
- RocketMQ事务消息-demo
RocketMQ为4.3.0版本(我这种写法4.2.0不行) 如果你之前用的其他版本,需要去修改下系统的环境变量 maven工程用到的jar包 <dependencies> <!-- ...
- ind2sub
ind2sub 线性索引的下标 语法 [I,J] = ind2sub(siz,IND)[I1,I2,I3,...,In] = ind2sub(siz,IND) 说明 ind2sub 函数确定与数组 ...