AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。
通过 AJAX 加载一段文本:
jQuery 代码:
$(document).ready(function(){
$("#b01").click(function(){
htmlobj=$.ajax({url:"/jquery/test1.txt",async:false});
$("#myDiv").html(htmlobj.responseText);
});
});
HTML 代码:
Let AJAX change this text
再举个栗子:
ajax() 方法通过 HTTP 请求加载远程数据。
该方法是 jQuery 底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性。
最简单的情况下,$.ajax() 可以不带任何参数直接使用。
注意:所有的选项都可以通过 $.ajaxSetup() 函数来全局设置。
//获取数据
function getData(callback) {
// ajax() 方法通过 HTTP 请求加载远程数据。
$.ajax({
url: 'https://photo.sina.cn/aj/v2/index?cate=military',
dataType: 'jsonp',
// 在一个 jsonp 请求中重写回调函数的名字。这个值用来替代在 "callback=?" 这种 GET 或 POST 请求中 URL 参数里的 "callback" 部分,比如 {jsonp:'onJsonPLoad'} 会导致将 "onJsonPLoad=?" 传给服务器。
jsonp: 'callback',
data: {
pagesize: perPageCount,
page: curPage
}
}).done(function (ret) { //ret是你调用的函数给你返回的数据!
if (ret && ret.code == 1) {
callback(ret.data); //如果数据没问题,那么生成节点并摆放好位置
curPage++
} else {
console.log('get error data');
}
});
}
url
类型:String
默认值: 当前页地址。发送请求的地址。
dataType
类型:String
预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如 XML MIME 类型就被识别为 XML。在 1.4 中,JSON 就会生成一个 JavaScript 对象,而 script 则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。可用值:
jsonp
类型:String
在一个 jsonp 请求中重写回调函数的名字。这个值用来替代在 "callback=?" 这种 GET 或 POST 请求中 URL 参数里的 "callback" 部分,比如 {jsonp:'onJsonPLoad'} 会导致将 "onJsonPLoad=?" 传给服务器。
data
类型:String
发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。查看 processData 选项说明以禁止此自动转换。必须为 Key/Value 格式。如果为数组,jQuery 将自动为不同值对应同一个名称。如 {foo:["bar1", "bar2"]} 转换为 '&foo=bar1&foo=bar2'。
always():一定会执行
catch():执行出错时执行(本体 object)
done():执行成功时执行
failed():执行出错时执行(服务器拒绝)
pipe():过滤方法
progress():当对象生成进度通知时,调用添加处理程序。
Promise():返回Object(延迟)的Promise(承诺)对象。
state():确定一个Object(延迟)对象的当前状态。
then():当(延迟)对象解决,拒绝或仍在进行中时,调用添加处理程序。