javascript之ajax

ajax(asynchronous javascript and xml)是由多个技术结合在一起的,其实使ajax能运作的是靠一个叫XMLHttpRequest的对象,而javascript承担了大部分体力活(向web发送请求,等待响应,处理,改变页面)

注意:要阻止主页面发送请求return false 或preventDefault()

对于XML的读取,xml文本类似html,所以可以利用jquery的选择器($(data).find('content').text();),可以使用.get()获取

json  {a:{aa:'aa',ab:'ab'},b:{bb:'bb',bc:'bc'}},可以用.getJson()获取,下面有介绍

1.纯XMLHttpRequest形式

var newXHR = new XMLHttpRequest();

newXHR.open('get','url?param');

newXHR.onreadystatechange = myCallbackFunction;//设置回调函数

newXML.send(null);//发送请求

最后接收响应,包括请求的状态,文本响应和XML响应或一个json对象

jQuery对Ajax操作进行了封装，在jQuery中$.ajax()方法属于最底层的方法，第2层是load(),$.get()和$.post()方法，第三层是$.getScript()和$.getJson()方法。第2层得方法，使用效率很高。 2.jquery方式load

.load('url');//我们只能从同一站点载入html文件,所以我们不能把google主页load到我们的页面中

load还可以选定内容.load(url + '  #XX');

//有参数传递，则是post方式

$("#resText").load("test.php",{name:"rain",age:"22"},function(){

});

回调参数

对于必须加载完后才能继续操作，load()方法提供了回调函数(callback),该函数有3个参数，

分别代表请求返回的内容，请求状态和XMLHttpRequest 对象，jQuery代码如下:

$("#resText").load("test.html",function(responseText,textStatus,XMLHttpRequest)){

//请求返回的内容

//请求状态 success error notmodiffed,timeout 4种

//XMLHttpRequest: XMLHttpRequest

在load()方法中，无论Ajax请求是否成功，只要当请求完成complete后，回调函数(callback)就被触发




3.jquery方式get/post

$.get(url,data,callback)

$.post(url,data,callback)

data可以是'name=XX&pass=XX'或一个对象{name:'XXX',pass:'XX'},最好用.serialize()收集表单提交参数(var data = $('#formId').serialize())

callback是回调函数

function(data,status){....}

4.jquery方式getJson

$.getJson('url','param=XX',callbackfunc);

function callbackfunc(data){

   $.eack(data,function(name,value)){..........}//遍历json对象

}