无刷新获得内容:

1. 动态加载，通过src属性-加载请求(  <img src=”./xxx.php?h=123&d=4″><script src=”x.php”> )
2. 通过浏览器204特性(页面不跳转 header(“HTTP/1.1 204 no content”) )
3. XMLHttpRequest对象

XMLHttpRequest对象，使用原生的实现Ajax

var  XHR = new XMLHttpRequest();

使用Ajax必须先创建一个XHR对象，但此方法不支持IE 6 之前的版本。IE6之前的版本要使用

var XHR = new ActiveXObject(“MicroSoft.XMLHTTP”);

这样我们就可以使用XHR对象了。使用XHR 对象方法

下面来看一个完整的Ajax请求

var XHR = new XMLHttpRequest();   //创建一个XHR对象
XHR.open("GET","res_api.php?qq=12345&b=gagd",false);   //第三个是一个布尔值，默认就是使用异步方式
//如果设置为true，那么在send()方法后线程会被阻塞
//XML    -----    POST  (请使用 setRequestHeader 来添加 HTTP 头)
//不设置请求头将无法提交数据
//XHR.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//XHR.send("data=ajax&name=cwj95");
XHR.onreadystatechange = function(){ 
     if(XHR.readyState === 4){ 
          if(XHR.status === 200){ 
              //......获得以后的要想执行的代码 
          }else{
           //........出现错误的处理方式 } 
} } 
XHR.send(); //发送数据

使用第三方jQuery库实现AJAX..

$.ajax({
type:"GET"
url:"res_api.php?qq=12345&b=gagd"
dataType:"json"
success:function(data){
     if(data.success){
           //......获得以后的要想执行的代码
     }else{
           //........出现错误
     }
}
error:function(xxx){
//........出现错误的处理方式
}
});

如果Ajax想要访问远程的接口文件，这个过程叫做跨域，但由于JS同源策略的影响，所以想要跨域，必须要提前处理，否刚会报错!!!

XMLHttpRequest cannot load http://xxx.xxx/abc.php. No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost’ is therefore not allowed access.

处理跨域可以使用下列的三种方式：
1.代理： 通过后端的php来访问远程，在返回给js，这种方式我们就不演示了
2.XHR2
HTML5中提供的XMLHTTPREQUEST Level2（及XHR2）已经实现了跨域访问。但ie10以下不支持
只需要在服务端填上响应头(这个比较方便)：

<?php
header("Access-Control-Allow-Origin:*");
/*星号表示所有的域都可以接受，*/
header("Access-Control-Allow-Methods:GET,POST");

3.jsonP(JsonP只能通过GET请求返回数据)
如果还通过json进行跨越，那么就会报错

这个问题和安全机制有关，默认不允许跨域调用，这里我们使用JSONP解决这个问题

$.ajax({
url:'http://xxx.xxx/abc.php',
method:'get',
dataType:'jsonp',
jsonp:'datademo',
success:function(data){
  .........    //通过jsonp就可以返回一个json对象
}
});
//当然后端也要处理
$cc = $_GET['datademo'];
echo $cc.'('.json_encode(array(1,2,3,5)).")";

JSONP原理:

其实JSONP并不是Ajax的规则，只是我们需要处理跨域请求时的一种解决方案，大家约定俗成的方法，一种有规则的字符串…..
他就是一个函数，通过 callback传入函数名，如下

GET: http://cwj95.com/func.php?callback=aa&…….
RETURN: aa({website:cwj95.com,name:正励志,qq:594262005})

我们在自己的script脚本中构造aa函数，这样就能直接获取到括号里的对象了

JS: function aa(object){ alert(object); }

我们通过 动态添加标签，就可以去请求数据，可以发现，我们并没有用到XMLHttpRequest对象

在jQuery中，已经为我们封装好了JSONP ,  如上面的jsonp:’datademo’,Jquery会自动赋值一个datademo字段，如下

后端只需要获得再将其以调用函数显示即可