什么是AJAX?
AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。 AJAX 是一种用于创建快速动态网页的技术。 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。 传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。 有很多使用 AJAX 的应用程序案例:百度智能提示,天气预报。
AJAX的实现?
var xhr = null ; //创建ajax对象
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
}else {
xhr = new Activexobject('Mircrsoft.XMLHTTP');
}
xhr.open('get', url,true);// 配置发生请求
xhr.send(null); //执行发生请求
//指定回调函数
xhr.onreadystatechange =function(){
if (xhr.readyState == 4&&xhr.status == 200) {
var data = xhr.responseText;
}
}
简单的封装ajax?
function ajax(data){
//data={data:"",dataType:"xml/json",type:"get/post ",url:"",asyn:"true/false",success:function(){}, failure:function(){}}
//data:{username:123,password:456}
//data = 'username=123&password=456';
//第一步:创建xhr对象
var xhr = null;
if(window.XMLHttpRequest){//标准的浏览器
xhr = new XMLHttpRequest();
}else{
xhr = new ActiveXObject('Microsoft.XMLHTTP');
}
//第二步:准备发送前的一些配置参数
var type = data.type == 'get'?'get':'post';
var url = '';
if(data.url){
url = data.url;
if(type == 'get'){
url += "?" + data.data + "&_t="+new Date().getTime();
}
}
var flag = data.asyn == 'true'?'true':'false';
xhr.open(type,url,flag);
//第三步:执行发送的动作
if(type == 'get'){
xhr.send(null);
}else if(type == 'post'){
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xhr.send(data.data);
}
//第四步:指定回调函数
xhr.onreadystatechange = function(){
if(this.readyState == 4){
if(this.status == 200){
if(typeof data.success == 'function'){
var d = data.dataType == 'xml'?xhr.responseXML:xhr.responseText;
data.success(d);
}
}else{
if(typeof data.failure == 'function'){
data.failure();
}
}
}
}
}