前言:ajax的知识相对比较简单,此文章仅代表鄙人的总结和理解,如有错漏,欢迎指正…
一、原理:
Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发送异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面。
XMLHttpRequest是ajax的核心机制,是一种支持异步请求的技术。简单的说,也就是javascript可以及时向服务器提出请求和处理响应,而不阻塞用户。达到无刷新的效果。
说人话就是:“HTTP协议的异步通信”。
那什么是同步,异步呢?
同步是阻塞模式,异步是非阻塞模式。
同步就是指一个进程在执行某个请求的时候,若该请求需要一段时间才能返回信息,那么这个进程将会一直等待下去,直到收到返回信息才继续执行下去;
异步是指进程不需要一直等下去,而是继续执行下面的操作,不管其他进程的状态。当有消息返回时系统会通知进程进行处理,这样可以提高执行的效率。
二、实现步骤:
get 请求
1) 创建一个XMLHttpRequest对象
2) 调用该对象的open方法
3) 如果是get请求,设置回调函数onreadystatechange = callback
4) Send
post 请求
1) 创建一个XMLHttpRequest对象
2) 调用该对象的open方法
3) 调用setRequestHeader(“Content-Type”, “application/x-www-form-urlencoded”);
4) 设置回调函数onreadystatechange = callback
5) Send
三、实现方式:
ajax通用调用方法
<script type="text/javascript">
$('#bid').click(function(){
$.ajax({
url:'3.query.php',//地址
dataType:'json',//数据类型
type:'GET',//类型
timeout:2000,//超时
//请求成功
success:function(data,status){
//alert(data);
//alert(status);
},
//失败/超时
error:function(XMLHttpRequest,textStatus,errorThrown){
if(textStatus==='timeout'){
alert('请求超时');
setTimeout(function(){
alert('重新请求');
},2000);
}
//alert(errorThrown);
}
})
})
</script>
jQuery - AJAX get() 方法
语法:
$.get(URL,callback);
例子:
$("button").click(function(){
$.get("demo_test.asp",function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
});
jQuery - AJAX post() 方法
语法:
$.post(URL,data,callback);
例子:
$("button").click(function(){
$.post("demo_test_post.asp",
{
name:"Donald Duck",
city:"Duckburg"
},
function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
});
结语:以往都是看别人的博客进行学习技术,其中不乏有精华博客也有吊儿郎当的CV大法文章,所以决定将自己所学所用所整理的知识分享给大家,主要还是想为了后浪们少走些弯路,多些正能量的博客,如有错漏,欢迎指正,仅希望大家能在我的博客中学到知识,解决到问题,那么就足够了。谢谢大家!