jQuery中的Ajax

jQuery中的Ajax

jQuery不仅对JavaScript语言进行了封装，也对Ajax异步交互进行了封装。jQuery提供了六个Ajax
操作的方法:

• load()方法
• $get()方法和$post()方法
• $ajax()方法
• $getScript()方法和$getJSON()方法
• $getScript()方法和$.getJSON(方法

jQuery除了封装了六个Ajax操作的方法，还提供了以下几种事件:

• ajaxStarct()和ajaxStop()事件
• ajaxComplete()事件、ajaxSend()事件、ajaxError()事件和ajaxSuccess()事件

load()方法

load()方法是jQuery中最为简单的Ajax方法，其语法结构如下:

$element.load(url,[data],[callback]);

• url:请求HTML页面的url地址。
• data:发送给服务器端的key/valuie形式的数据内容。
• callback: Ajax请求完成时的回调函数。

$('button').click(function(){
    $('div').load('server.js');
});

注意:load()方法的请求方式由是否传递参数决定。即传递参数，为GET方式;不传递参数，为
POST方式。

$.get()与$.post()方法

$post()方法使用POST方式向服务器端发送异步请求。其语法结构如下:

$.post(url[data],[callback],[type]);

• url:请求HHTML页面的url地址。
• data:发送给服务器端的key/value形式的数据内容。
• callback: Ajax请求完成时的回调函数。
• type:设置返回数据内容的格式。值为xml、htl、script、json、text和_default。

$('.btn').click(function () {
    $('button').load('data/server2.txt', { name: '123' }, function () {
        console.log('success');
    })
})

$.ajax()方法

$ajax(方法是jQuery中最为底层的Ajax方法，其语法结构如下:

• url:请求HTML页面的url地址。
• settings: key/value形式的请求设置，所有参数都是可选的。

$("button").click(function(){
    $.ajax({
        url:"server.js",
        type:"post",
        data:"this is ajax",
        success:function(data){
            consolelog(data);//服务器响应回数据之后的处理逻辑
        }
    });
});