Hello I'm Shendi,this is ajax note;get with w3c...
AJAX(Asynchronous Javascript and xml) 异步js和xml
AJAX 不是新的编程语言,而是一种使用现有标准的新方法
AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下
AJAX是一种无需重新加载整个网页的情况下,能够更新部分网页的技术
XMLHttpRequest(XHR)是AJAX的基础
所有现代浏览器均支持XMLHttpRequest对象(IE5 和 IE6 使用 ActiveXObject)
创建XMLHttpRequest对象
var obj = new XMLHttpRequest();
老版本的(IE5 IE6) 使用ActiveXObject
var obj = new ActiveXObject("Microsoft.XMLHTTP");
兼容创建(应对所有的现代浏览器)
var obj;
if (window.XMLHttpRequest) {
//支持XMLHttpReqeust
obj = new XMLHttpRequest();
} else {
//不支持
obj = new ActiveXObject("Microsoft.XMLHTTP");
}
XHR请求
向服务器发送请求:使用XMLHttpRequest对象的open()和send()函数
open(method,url,async); 规定请求的类型,URL,以及是否异步处理请求
method 请求的类型;GET 或 POST
url 文件在服务器上的位置
async true(异步) false(同步)
send(string); 发送请求到服务器XHRXHR
string 仅用于POST请求=url上面的参数比如:a=b&b=c
异步请求获取服务器上的hello.txt文件,GET请求
var obj = new XMLHttpRequest();
obj.open("GET","hello.txt",true);
obj.send();
GET or POST?
与POST相比,GET更简单也更快,并且在大部分情况下都能用
在以下情况中,请使用POST请求
无法使用缓存文件(更新服务器上的文件或数据库)
get获取到的可能是浏览器缓存的结果
(可以像验证码点击刷新那样随机更改url参数来解决)
发送大量数据(POST无数据量限制)
发送包含位置字符的用户输入
可以使用 setReqeustHeader(header,value); 函数来添加http头
header 规定头名称
value 规定头的值
当async = true时(异步),
请规定在响应处于 onreadystatechange 事件中的就绪状态时执行的函数
obj.onreadystatechange=function () {...}
obj.open(...);
obj.send();
XHR响应
使用XMLHttpRequest对象的responseText或responseXML属性来获取服务器响应
responseText 获得字符串形式的响应数据
responseXML 获得XML形式的响应数据
onreadystatechange 事件
当请求被送到服务器时,我们需要执行一些基于响应的任务
每当readyState改变时,就会触发onreadystatechange事件
readyState属性存有XMLHttpRequest的状态信息 0-4
0 请求未初始化
1 服务器连接已建立
2 请求已接收
3 请求处理中
4 请求已完成 且响应已就绪
status
200 完成
404 未找到页面
