什么是AJAX
AJAX = 异步 JavaScript 和 XML。
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。
AJAX原理:
Ajax主要的功能是实现了浏览器端 异步 访问服务器:通过浏览器的XMLHttpRequest对象发出小部分数据,与服务端进行交互,服务端返回小部分数据,然后更新客户端的部分页面。
json字符串进行信息传递:
json是Ajax发送小部分数据的一种轻量级数据格式,可以简单易懂的给服务器或者浏览器交互数据,包括json对象,json数组对象。
在jq中的ajax对象的格式为:
$.ajax({
})
各类属性
一个完整的ajax对象起码应该有四个属性type,url,data,success
1.type这个是ajax发送请求时所用的格式,值为字符串类型的大写的POST或者GET
type: "GET",
2.url这个是请求读取的文件的地址,可以是在线,也可以是本地。如果在本地,需要输入 相对路径,并确保服务器开启!
url: "https://cnodejs.org/api/v1/topics", //url:文件路径
3.seccess这个是ajax请求发送成功后的操作,后跟一个回调参数为result的函数,result指接收到的数据
success: function(result) {
console.log(result) //result 指的的请求发送成功后接收到的数据
},
4.data这个是发送请求后传入的数据
data: {
//这里是对接收到的数据进行的一些设置
},
GET和POST请求
与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。
然而,在以下情况中,请使用 POST 请求:
无法使用缓存文件(更新服务器上的文件或数据库)
向服务器发送大量数据(POST 没有数据量限制)
发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠
参数
url : String 发送请求的地址,默认为当前页地址
type: String 请求方式(post或get,默认为get)
data PlainObject 或 String 或者 Array 发送到服务器的数据
dataType:String 预期服务器返回的数据类型,类型可以是XML,HTML,JSON,Text
beforeSend : Function(jqXHR jqxhr,String status) 发送请求前调用的函数,可用于设置请求头等,返回FALSE终止请求
Function(任意类型 result, 函数,
String textStatus,jqXHR jqxhr) 请求成功后调用的 参数result:可选,由服务器返回的数据
参数textStatus:可选,错误信息
$.ajax()方法的参数语法比较特殊,参数列表需要包含在一堆花括号“{}”之间,没个参数以“参数名”:“参数值”的方式书写;如有多个参数,以逗号“,”隔开。----JSON写法
$.ajax({
"url":"userServlet", //要提交的URL路径
"type":"GET", //发送请求的方式
"data":"name="+name, //要发送到服务器的数据
"dataType":"text", //指定返回的数据格式
"success":"callback", //响应成功后要执行的代码
"error":function(){ //请求失败后要执行的代码
alert("用户名验证时出现错误,请稍后再试");
}
});
//响应成功的回调函数
function callback(data){
if(data=="true"){
$("#nameDIV").html("用户名已被使用");
}else{
$("#nameDIV").html("用户名可以使用");
}
}