关于AJAX异步请求的那些事儿(1)
1、什么事AJAX?
Asynchronous Javascript And XML:异步的JS和XML,由Google2002年在GoogleSuggest应用提出,目标实现客户端和服务器“同时”运行——异步的HTTP请求和响应,客户端不会经常出现“一片惨白”,提高浏览体验。涉及到的技术:HTML、CSS、JS、DOM、XML、JSON等,属于前端范畴,是纯客户端技术。
2、AJAX实现的效果:
(1)客户端和服务器异步运行
(2)客户端页面的局部刷新
(3)动态页面的静态化
3、使用AJAX的步骤
(1)创建XHR对象:var xhr=null;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest;
}else{
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
(2)绑定onreadyStatechange监听函数
xhr.onreadystatechange = function(){
}
(3)创建请求消息,建立到服务器的连接
xhr.open('GET/POST', 'xx.php', true);
(4)发送请求消息
xhr.send(null/data);
3、XMLHttpRequest的常用成员
常用成员属性: |
|
status:0 |
保存着服务器返回的响应消息的状态码 |
statusText:'' |
保存着服务器返回的响应消息的原因短句 |
responseText:'' |
保存着响应消息的主体——看做一段String |
responseXML:null |
保存着响应消息的主体——看做一个XMLDOM对象 |
timeout:0 |
设置XHR发起请求消息后,等待服务器给出响应消息的持续时间 |
readyState:0 只读的,其值是随着请求/响应的进程而自动改变的——用于描述当前请求/响应进行到哪一步了 |
0 - UNSENT 请求消息尚未发送 1 - OPENED XHR已创建请求消息,打开针对服务器的连接 2 - HEADERS_RECEIVED XHR对象已经接收到响应消息的头部 3 - LOADING XHR正在加载响应主体数据 4 - DONE XHR对象已经接收完毕响应消息 |
常用成员事件: |
|
onreadystatechange:fn |
当XHR的readyState值发生改变,触发此句柄 |
ontimeout:fn |
当XHR的请求超时,触发此句柄 |
onerror:fn |
当XHR发生请求/响应错误,触发此句柄 |
常用的成员方法: |
|
getAllResponseHeaders() |
获取响应消息中所有的头部 |
getResponseHeader(headerName) |
获取响应消息中指定的头部 |
open(METHOD, URI, isAysnc) |
创建一个HTTP请求消息,打开一个针对服务器的连接 |
send( null/'k1=v1&k2=v2&...' ) |
发送HTTP请求消息 |
setRequestHeader(name, value) |
在请求消息发送之前,设置一个请求消息头部 |
关于AJAX异步请求的那些事儿(1)的更多相关文章
- 关于AJAX异步请求的那些事儿(2)
1.使用AJAX发起GET请求消息 xhr.open("GET","XX.PHP?K1=V1$K2=V2",true); xhr.send(null); 2.使 ...
- ajax异步请求
做前端开发的朋友对于ajax异步更新一定印象深刻,作为刚入坑的小白,今天就和大家一起聊聊关于ajax异步请求的那点事.既然是ajax就少不了jQuery的知识,推荐大家访问www.w3school.c ...
- spring HandlerInterceptorAdapter拦截ajax异步请求,报错ERR_INCOMPLETE_CHUNKED_ENCODING
话不多说,直接上正文. 异常信息: Failed to load resource: net::ERR_INCOMPLETE_CHUNKED_ENCODING 问题描述: 该异常是在页面发送ajax请 ...
- jquery Ajax异步请求之session
写了一个脚本,如下: $(function () { $("#btnVcode").click(function () { var receiveMobile = $(" ...
- ajax异步请求Response.Redirect重定向
一个ajax异步请求报错->捕获异常->重定向错误提示页面. 一个简单的流程 结果一直搞不定.重定向无效.各种百度之. 后来突然想起 ajax的请求是不能在后台重定向的. 如果硬要重定向 ...
- jquery的ajax异步请求接收返回json数据
http://www.jb51.net/article/51122.htm jquery的ajax异步请求接收返回json数据方法设置简单,一个是服务器处理程序是返回json数据,另一种就是ajax发 ...
- MVC&WebForm对照学习:ajax异步请求
写在前面:由于工作需要,本人刚接触asp.net mvc,虽然webform的项目干过几个.但是也不是很精通.抛开asp.net webform和asp.net mvc的各自优劣和诸多差异先不说.我认 ...
- AJAX异步请求原理和过程
AJAX 指异步 JavaScript 及 XML(Asynchronous JavaScript And XML),它不是一种新的编程语言,而是一种使用现有标准的新方法. AJAX 基于 JavaS ...
- Ajax异步请求-简单模版
<script type="text/javascript"> window.onload = function () { document.getElementByI ...
随机推荐
- 《ServerLess 给前端带来了什么》笔记
1. Serverless 是什么 Serverless “无服务器架构”,即大量依赖第三方服务(也叫做后端即服务,即“BaaS”)或暂存容器中运行的自定义代码(函数即服务,即“FaaS”)的应用程序 ...
- 求包含每个有序数组(共k个)至少一个元素的最小区间
title: 求包含每个有序数组(共k个)至少一个元素的最小区间 toc: false date: 2018-09-22 21:03:22 categories: OJ tags: 归并 给定k个有序 ...
- Python—使用xml.sax解析xml文件
什么是sax? SAX是一种基于事件驱动的API. 利用SAX解析XML文档牵涉到两个部分:解析器和事件处理器. 解析器负责读取XML文档,并向事件处理器发送事件,如元素开始跟元素结束事件; 而事件处 ...
- 双向链表C++实现
双向链表实现,通过C++实现 #ifndef LinkList_hpp #define LinkList_hpp typedef struct Node{ int data; Node* next; ...
- deploy sql clr
1, create strong signed key file 2, create asymmetric key
- I'm studying Bootstrap! loading...
最近在学习bootstrap框架. Bootstrap框架是目前前端最受欢迎的框架,出于Twitter公司!搞前端你说你不会Bootstrap都不好意思见人呢. Bootstrap是基于Html Cs ...
- MAC 下的pycharm部分使用方法
1.在创建之初,可以选择自己想要使用的python版本. 如果之后想要更换Python版本,可以通过~~~更换选择Python版本. 2.创建.py文件,点击文件名,出现如下界面: 点击new--py ...
- centos 7 防火墙配置
centos 7里的防火墙使用的是firewall. 之前问过一个运维大牛,selinux的位置有点尴尬,说他们在工作中一般都会在第一时间关闭掉.我记得当时自己假设网站的时候就被这个坑了大半晚上.这个 ...
- POJ 3370 Halloween treats( 鸽巢原理简单题 )
链接:传送门 题意:万圣节到了,有 c 个小朋友向 n 个住户要糖果,根据以往的经验,第i个住户会给他们a[ i ]颗糖果,但是为了和谐起见,小朋友们决定要来的糖果要能平分,所以他们只会选择一部分住户 ...
- [luogu2059 JLOI2013] 卡牌游戏 (概率dp)
题目描述 N个人坐成一圈玩游戏.一开始我们把所有玩家按顺时针从1到N编号.首先第一回合是玩家1作为庄家.每个回合庄家都会随机(即按相等的概率)从卡牌堆里选择一张卡片,假设卡片上的数字为X,则庄家首先把 ...