Ajax

Ajax的概念,作用

一 什么是Ajax

• Ajax 即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发技术。

简单的说就是可以让网页某个局部部分动态地给服务器发起请求，而不用整个页面刷新。是一种可以局部发请求的技术

Ajax的使用步骤

1 Ajax发get请求

<script>
        
           //1 创建对象
            var xhr = new XMLHttpRequest();
            //2请求行
            xhr.open("get","data.php");//参数表示请求方式,地址
            //3请求头 get不用设置

            //4发送请求
            xhr.send();
            //5 监听响应的回调函数
            //xhr.onload=function(){  
           // }
        // 5 解决IE兼容问题
xhr.onreadystatechange=function(){
            if(xhr.readyState == 4 && xhr.status ==200){
                //响应体
                console.log(xhr.responseText);
            }
        }
    </script>

2 ajax的post请求

//1 创建对象
             var xhr ;
             //xhr也有兼容性
             if(XMLHttpRequest){
                xhr = new XMLHttpRequest();
             }else{
                 xhr= new ActiveXObject("Microsoft.XMLHTTP");
             }
            //2请求行
            xhr.open("post","checkUser.php");
            //3请求头 get不用设置,post要设置,固定格式
            xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
           // 5 解决IE兼容问题
          xhr.onreadystatechange=function(){
          //readyState:获取ajax请求的状态
          //status:响应状态码
            if(xhr.readyState == 4 && xhr.status ==200){
                //响应体
                console.log(xhr.responseText);
            }
        }

ajax发起请求的5种状态

0 --->请求未初始化
1 服务器连接已建立
2 请求接收中
3 请求处理中
4 请求已完成，且响应已就绪

• 状态码可以通过xhr对象的 readyState 属性获取
• 说明：
  • 刚刚创建出xhr对象时，状态码是0
  • 当xhr调用open方法后，状态码是1
  • 2，3，4这几个状态码都是在 onreadystatechange 时间里发生改变
  • 只有状态码为4，才代表响应完成

JSON 对象

JSON(JavaScript Object Notation, JS对象标记) 是一种轻量级的数据交换（传输）格式
所有语言都支持JSON，因为JSON本质上就只是一个按规定格式写的字符串

• json作用

前端后台等开发使用不同的语言,不同语言的数据无法直接共享,JSON各
语言都识别,因此json就是为了能方便各种语言之间数据交换的数据格式
注:只要是支持JSON的语言，其内部都提供了一套方法，把JSON字符串转换为自己语言里的数组或对象。

• json使用

由{}或[]包裹,{}:对象,[]:数组
'{"name":"andy","age":16,"gender":true}';
'[{"name":"jack","age":16,"gender":true},{"name":"rose","age":15,"gender":false}]';

• js与PHP中与json的转换
  1 js中

JSON.stringify()//转换成JSON对象
JSON.parse()//转成js对象

2 PHP中

json_encode();//php -> json
json_decode();//json -> php

js中JSON转换兼容解决

1 使用eval

用法：eval("(" + JSON字符串 + ")");

2 使用插件,导入即可,IE7以上不用导入,使用css hack

 <!--[if lte IE 7]>
     //ie7 及以下才导入
        <script src=json2.js></script>
        <![endif]-->