AJAX教程

Posted 2020-08-21 安雅

AJAX教程（异步的javascript和XML）——局部刷新

创建动态网页的技术

异步：做一件事中间继续做另一件事情

同步：做完一件事情之后才能做其他的事

如果需要更新内容，必须刷新整个页面（AJAX）——实现异步更新

 

XMLHttpRequest是AJAX的基础——与后台进行交互（有兼容性）

创建AJAX的核心对象

Var httpRequest = null;

Document.all 只有IE才能识别

If(document.all){

httpRequest = new ActiveXboject(“Microsoft.XMLHTTP”);

}else{

httpRequest = new XMLHttpRequest();

}

 

向服务器发送请求

//true为异步，false为同步，默认情况下异步

//如果为post提交，必须使用httpRequest .setRequestHeader("Content-type","application/x-www-form-urlencoded");

 

httpRequest.open(“get/post”,”url”,true);

//传送参数，如果没有参数，则可以为空

httpRequest.send();

 

属性：

onreadyStatechange:调用函数

readyState：1、0: 请求未初始化

      2、1: 服务器连接已建立

                    3、2: 请求已接收

    4、3: 请求处理中

    5、4: 请求已完成，且响应已就绪

Status ： 1、200: "OK"    2、404: 未找到页面

JQuery版的AJAX：

$(function(){

$(“button”).click(function(){

Var username = $(“#username”).var();

Var pwd = $(“#pwd”).var();

$.ajax({

Type:”post”,

Url:”/Ajax/TestServlet”,

Data:(“username”:username,”pwd”:pwd),

//JSon：数据的交换模式

//dataType：返回的格式

dataType:”text”,

Success:function(data){

Alert(data);

}

});

});