ajax(一)

• 
  
• 创建xhr对象: new XHRHttpRequest()
  xhr对象的属性:
  

responseText: 代表响应主体的响应文本;
status: 返回状态码, 200: ok, 404:错误…
同步方式

xhr.open('get','test.php?rand=Math.random()',false); // false:同步
xhr.send(null);

异步方式

onreadystatechange事件监听;
检测readState状态;

xhr.onreadstatechange = function(){
    if(xhr.readyState==4 && xhr.status==200){
        console.log(xhr.responseText);
    }
}
xhr.open('get','test.php',true);
xhr.send(null);

GET

web上, get一般是URL提交请求;
如demo.php?name=Lee&age=100

Post

POST一般是表单提交;
如: <form method="post"><input type="text" name="name" value=...>

xhr.onreadstatechange = function(){
    if(xhr.readyState==4 && xhr.status==200){
        console.log(xhr.responseText);
    }
}
xhr.open('post','test.php',true);
// 修改请求头,模拟表单提交
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded')
xhr.send('name=Lee&age=10');  // 通过这里提交数据

头信息

1. 响应头信息: 服务器返回的信息, 客户端可以获取但不可设置;
2. 请求头信息: 客户端可以设置但不获取;
   全部响应头信息: xhr.getResponseHeaders()
   获取响应头信息内容:xhr.getResponseHeader('Contnet-Type')
   设置: xhr.setResponseHeader(key,value)

特殊字符编码

如字符中包含’&’, 则需要对其进行编码,否则会出现问题: encodeURIComponent(name);