Ajax

Ajax:Asynchronous JavaScript and XML(异步JavaScript和XML)     用javascript异步的形式去操作xml    数据交互

　　----　　节省用户操作，时间，提高用户体验，减少数据请求        传输获取数据

使用方法：

　　1、创建Ajax对象

　　　　IE6以下 new ActiveXObject('Microsoft.XMLHTTP');

　　　　其余：new XMLHttpRequest();

　　　　解决办法：　

　　　　　　var xhr=null;
　　　　　　if(window.XMLHttpRequest){
　　　　　　    xhr=new XMLHttpRequest();
　　　　　　}else{
  　　　　　　  xhr=new ActiveXObject('Microsoft.XMLHTTP');
　　　　　　}
　　　　在js里，用一个不存在的变量会出错，而用一个不存在的属性只会返回一个undefined

　　2、在地址栏输入地址连接服务器

　　　　open方法：open(打开方式，地址，是否异步)；

　　　　　　同步：阻塞  前面的代码会影响后面代码的执行

　　　　　　异步：非阻塞 前面代码不会影响后面代码执行

　　3、提交

　　　　　xhr.send();

　　　　表单：数据的提交

　　　　　　action:数据提交的地址，默认是当前页面

　　　　　　method：数据提交的方式，默认是get方式

　　　　　　　　　1、get ：把数据名称和数据值用=连接，如果有多个的话，那么他会把多个数据组合用&进行连接，然后把数据放到url？后面传到指定页面。

　　　　　　　　　　　　　　容量低，安全性低，url长度的限制，不要通过get的方式传递过多的数据

　　　　　　　　　　　　　　get用于获取数据，，可以缓存

　　　　　　　　　2、post ：安全性一般，容量几乎无限（大）

　　　　　　　　　　　　　　post用于上传数据（如用户注册），不会缓存

　　　　　　enctype:提交数据格式，默认application/x-www-form-urlencoded　　

　　4、等待服务器返回内容

　　　　onreadystatechange事件

　　　　　　readyState属性：请求状态

　　　　　　　　0 （初始化）还没有调用open()方法

　　　　　　　　1（载入）已调用send()方法，正在发送请求

　　　　　　　　2(载入完成)send()方法已完成，已收到全部响应内容

　　　　　　　　3 （解析）正在解析响应内容

　　　　　　　　4（完成）响应内容解析完成，可以在客户端调用了

　　　　　　status属性：服务器（请求资源）的状态，是否获得成功，成功=200

　　　　　　　　xhr.onreadystatechange=function () {
　　　　　　　　    if(xhr.readyState==4){
　　　　　　　　        if(xhr.status==200){
　　　　　　　　            alert(xhr.responseText);
　　　　　　　　        }else {
　　　　　　　　            alert("出错啦");
　　　　　　　　        }
  　　　　　　　　  }
　　　　　　　　}

　　　　responseText:Ajax请求返回的内容存放到这个属性下面   类型都为String

　　　　responseXML:返回XML形式的内容

　　　　onreadystatechange：当readyState改变的时候触发

JSON:　　

　　　　(注意：JSON的key值必须用双引号)

　　　　JSON.stringify()：可以把一个对象转成对应的字符串

　　　　JSON.parse():可以把字符串转成对应的对象

解决问题:

　　1、解决缓存现象--------在url?后面连接一个随机数，时间戳

　　　　xhr.open('get','index.php?username=xing&'+new Date().getTime(),true);

　　2、乱码--------编码encodeURI()

　　　　xhr.open('get','index.php?username='+encodeURI('星')+&'+new Date().getTime(),true);

　　3、post方式，数据放在send()里面作为参数传递(post没有缓存问题)

　　　　xhr.setRequestHeader('content-type','application/x-www-form-urlencoded');//申明数据发送的类型

　　　　send('username='xing'');