$ajax 筛选某个属性,JQuery之Ajax篇

Ajax主要实现了异步请求，接受响应及执行回调

load方法

load方法可以传三个参数：

url(请求html文件的url地址，参数类型为string)

data(可选，发送的key/value数据，参数类型为object)

callback(可选，成功或失败的回调函数)

html

jquery$('input').click(function(){

$('#box').load('test.html');

})

对载入的HTML进行筛选，只需在后面加入选择器$('input').click(function(){

$('#box').load("test.html .my");

});

get方法

jquery$('input').click(function(){

$('#box').load('test.php?url=ycku');

});

jqueryif($_GET['url'] == 'ycku') {

echo '获取成功'

}else{

echo '获取失败'

}

post方法

传递data$('input').click(function(){

$('#box').load('test.php',{

url : 'ycku'

});

});

接收数据if($_POST['url'] == 'ycku') {

echo '获取成功'

}else {

echo '获取失败'

}

回调函数callback

callback回调函数可以传递三个参数:   responseText(请求返回) ， textStatus(请求状态) ，XMLHttpRequest(XMLHttpRequest对象)$('input').click(function(){

$('#box').load('test.php',{

url : 'ycku'

},function(response,status,xhr){

alert('返回的值为: '+response +",状态为 ："+status+",状态是："+xhr.statusText);

//回调函数修改数据的值

$('#box').html(response+'12345')；

})

})

调用的属性

responseText作为响应主体被返回的文本

responseXML如果响应主体内容类型是“text/xml”或 “application/xml”，则返回包含数据的XML DOM文档

status响应的HTTP状态

statusTextHTTP状态的说明

如果成功返回数据，xhr对象的statusText属性则返回'OK'字符串，

状态码说明

200OK服务器成功返回了页面

400Bad Request语法错误导致服务器不识别

401Unauthorized请求需要用户认证

404Not found指定的URL在服务器上找不到

500Internal Server Error服务器遇到意外错误，无法完成请求

503ServiceUnavailable由于服务器过载或维护导致无法完成请求

$.get()和$.post()

使用$.get()异步返回html类型$('input').click(function(){

$.get('test.php',{

url : 'ycku'

}),function(response,status,xhr){

if(status == 'success'){

$('#box').html(response);

}

}

})

XML数据格式 xml version = '1.0'?>

www.baidu.com

使用$.get()异步返回xml$('input').click(function(){

$.get('test.xml',function(response,status,xhr){

$('#box').html($(response).find('root').find('url').text());

})

})

JSON数据格式[

{

"url" : "www.baidu.com"

}

]

使用$.post()传递JSON数据$.post('test.php',{

url : 'ycku'

},function(response,status,xhr){

$('#box').html(response);

});

$.getScript()和$.getJSON()

$.getScript()多用于在特定的情况下加载js文件

点击按钮后再加载js文件$('input').click(function(){

$.getScript('test.js');

});

$.getJSON()专门用于加载json文件的$('input').click(function(){

$.getJSON('test.json',function(response,status,xhr){

alert('response[0].url');

})

})

$.ajax()

ajax中最底层的方法，所有都是基于$.ajax的封装

$.ajax()方法 对象参数表

urlString发送请求的地址

typeString请求方式：POST或GET，默认GET

timeoutNumber设置请求超时的时间

dataObject或String发送到服务器的数据，键值对字符串或对象

dataType   String返回的数据类型，比如html,xml,json等

beforeSend   Function发送请求前后修改XMLHttpRequest对象的函数

complete      Function请求完成后调用的回调函数

success          Function请求成功后调用的回调函数

error              Function请求失败时调用的回调函数

global            Boolean默认为true ,是否触发全局Ajax

cacheBoolean设置浏览器缓响应，默认为true，如果dataType类型为script或json，则为false

content        DOM 指定某个元素为与这个请求相关的所有回调函数的上下文

contentType     String指定请求内容的类型，默认为application/x-www-form-urlencoded

async                Boolean是否异步处理，默认为true,false为同步处理

processData      Boolean默认为true,数据被处理为URL编码格式，如果为false,则阻止将传入的数据处理为URL编码的格式

dataFilterFunction用来筛选响应数据的回调函数

ifModified         Boolean默认为false,不进行头检测，true的话是进行头检测，响应内容与上次请求改变时，请求认为是成功的

jsonp  String指定一个查询参数名称来覆盖默认的jsonp回调参数名为callback

username           String在HTTP认证请求中使用的用户名

password           String在HTTP认证请求中使用的密码

0Ajax主要实现了异步请求，接受响应及执行回调

==================================================================load方法

load方法可以传三个参数：

url(请求html文件的url地址，参数类型为string)

data(可选，发送的key/value数据，参数类型为object)

callback(可选，成功或失败的回调函数)

/*****html

/******jquery

$('input').click(function(){

$('#box').load('test.html');

})

/******对载入的HTML进行筛选，只需在后面加入选择器

$('input').click(function(){

$('#box').load("test.html .my");

});

====================================================================get方法

/*******jquery

$('input').click(function(){

$('#box').load('test.php?url=ycku');

});

/******jquery

if($_GET['url'] == 'ycku') {

echo '获取成功'

}else{

echo '获取失败'

}

=====================================================================post方法

/******传递data

$('input').click(function(){

$('#box').load('test.php',{

url : 'ycku'

});

});

/*************************接收数据

if($_POST['url'] == 'ycku') {

echo '获取成功'

}else {

echo '获取失败'

}

=============================================================================回调函数callback

callback回调函数可以传递三个参数:   responseText(请求返回) ， textStatus(请求状态) ，XMLHttpRequest(XMLHttpRequest对象)

$('input').click(function(){

$('#box').load('test.php',{

url : 'ycku'

},function(response,status,xhr){

alert('返回的值为: '+response +",状态为 ："+status+",状态是："+xhr.statusText);

//回调函数修改数据的值

$('#box').html(response+'12345')；

})

})

==================================================================================调用的属性

responseText作为响应主体被返回的文本

responseXML如果响应主体内容类型是“text/xml”或 “application/xml”，则返回包含数据的XML DOM文档

status响应的HTTP状态

statusTextHTTP状态的说明

如果成功返回数据，xhr对象的statusText属性则返回'OK'字符串，

===================================================================================状态码说明

200OK服务器成功返回了页面

400Bad Request语法错误导致服务器不识别

401Unauthorized请求需要用户认证

404Not found指定的URL在服务器上找不到

500Internal Server Error服务器遇到意外错误，无法完成请求

503ServiceUnavailable由于服务器过载或维护导致无法完成请求

====================================================================================$.get()和$.post()

//使用$.get()异步返回html类型

$('input').click(function(){

$.get('test.php',{

url : 'ycku'

}),function(response,status,xhr){

if(status == 'success'){

$('#box').html(response);

}

}

})

//XML数据格式

xml version = '1.0'?>

www.baidu.com

//使用$.get()异步返回xml

$('input').click(function(){

$.get('test.xml',function(response,status,xhr){

$('#box').html($(response).find('root').find('url').text());

})

})

//JSON数据格式

[

{

"url" : "www.baidu.com"

}

]

//使用$.post()传递JSON数据

$.post('test.php',{

url : 'ycku'

},function(response,status,xhr){

$('#box').html(response);

});

=============================================$.getScript()和$.getJSON()

/***********************$.getScript()多用于在特定的情况下加载js文件

//点击按钮后再加载js文件

$('input').click(function(){

$.getScript('test.js');

});

/***********************$.getJSON()专门用于加载json文件的

$('input').click(function(){

$.getJSON('test.json',function(response,status,xhr){

alert('response[0].url');

})

})

==================================================$.ajax()

//ajax中最底层的方法，所有都是基于$.ajax的封装

/**********************************$.ajax()方法 对象参数表

urlString发送请求的地址

typeString请求方式：POST或GET，默认GET

timeoutNumber设置请求超时的时间

dataObject或String发送到服务器的数据，键值对字符串或对象

dataType   String返回的数据类型，比如html,xml,json等

beforeSend   Function发送请求前后修改XMLHttpRequest对象的函数

complete      Function请求完成后调用的回调函数

success          Function请求成功后调用的回调函数

error              Function请求失败时调用的回调函数

global            Boolean默认为true ,是否触发全局Ajax

cacheBoolean设置浏览器缓响应，默认为true，如果dataType类型为script或json，则为false

content        DOM 指定某个元素为与这个请求相关的所有回调函数的上下文

contentType     String指定请求内容的类型，默认为application/x-www-form-urlencoded

async                Boolean是否异步处理，默认为true,false为同步处理

processData      Boolean默认为true,数据被处理为URL编码格式，如果为false,则阻止将传入的数据处理为URL编码的格式

dataFilterFunction用来筛选响应数据的回调函数

ifModified         Boolean默认为false,不进行头检测，true的话是进行头检测，响应内容与上次请求改变时，请求认为是成功的

jsonp  String指定一个查询参数名称来覆盖默认的jsonp回调参数名为callback

username           String在HTTP认证请求中使用的用户名

password           String在HTTP认证请求中使用的密码