Asynchronous JavaScript and XML,异步JavaScript和XML
主要目的用于页面的局部刷新。不用全部刷新，提高性能。
在AJAX中主要是通过XMLHttpRequest对象处理发送异步请求和处理回应的，此对象最早是在IE 5中以ActiveX组件的形式出现的，一直到2005年之后才被广泛的使用，而如果要想创建一个XMLHttpRequest对象必须使用JavaScript。
创建XMLHttpRequest对象 —— create_ajax.htm ：
<script language="JavaScript">
var xmlHttp ; // AJAX核心对象名称
function createXMLHttp() { // 创建XMLHttpRequest核心对象
if (window.XMLHttpRequest) { // 判断当前使用的浏览器类型
xmlHttp = new XMLHttpRequest();// 表示使用的为FireFox内核的浏览器
} else { // 表示使用的是IE内核的浏览器
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
</script>
XMLHttpRequest对象的属性 ：
|
No. |
属性 |
描述 |
|
1 |
onreadystatechange |
指定当readState状态改变时使用的操作，一般都用于指定具体的回调函数 |
|
2 |
readyState |
返回当前请求的状态，只读 |
|
3 |
responseBody |
将回应信息正文以unsigned byte数组形式返回，只读 |
|
4 |
responseStream |
以Ado Stream对象的形式返回响应信息，只读 |
|
5 |
responseText |
接收以普通文本返回的数据，只读 |
|
6 |
responseXML |
接收以XML文档形式回应的数据，只读 |
|
7 |
status |
返回当前请求的http状态码，只读 |
|
8 |
statusText |
返回当前请求的响应行状态，只读 |
readState取值：
对readState一共有五种取值，分别是：
0：请求没有发出（在调用open()函数之前之前）。
1：请求已经建立但还没有发出（调用send()函数之前）。
2：请求已经发出正在处理之中（这里通常可以从响应得到内容头部）。
3：请求已经处理，正在接收服务器的信息，响应中通常有部分数据可用，但是服务器还没有完成响应。
4：响应已完成，可以访问服务器响应并使用它。
XMLHttpRequest对象的方法 ：
|
No. |
方法 |
描述 |
|
1 |
abort() |
取消当前所发出的请求 |
|
2 |
getAllResponseHeaders() |
取得所有的HTTP头信息 |
|
3 |
getResponseHeader() |
取得一个指定的HTTP头信息 |
|
4 |
open() |
创建一个HTTP请求，并指定请求模式，例如：GET请求或POST请求 |
|
5 |
send() |
将创建的请求发送到服务器端，并接收回应信息 |
|
6 |
setRequestHeader() |
设置一个指定请求的HTTP头信息 |
使用异步处理 —— ajax_receive_content.htm ：
<html><head><title>www.mldnjava.cn，MLDN高端Java培训</title></head><body>
<script language="JavaScript">
var xmlHttp ; // AJAX核心对象名称
function createXMLHttp() { // 创建XMLHttpRequest核心对象
if (window.XMLHttpRequest) { // 判断当前使用的浏览器类型
xmlHttp = new XMLHttpRequest(); // 表示使用的为FireFox内核的浏览器
} else { // 表示使用的是IE内核的浏览器
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") ;
}
}
function showMsg(){
createXMLHttp() ; // 建立xmlHttp核心对象
xmlHttp.open("POST","content.htm"); // 设置一个请求
// 设置请求完成之后处理的回调函数
xmlHttp.onreadystatechange = showMsgCallback ;
xmlHttp.send(null) ; // 发送请求，不传递任何参数
}
function showMsgCallback(){ // 定义回调函数
if (xmlHttp.readyState == 4) { // 数据返回完毕
if (xmlHttp.status == 200) { // HTTP操作正常
var text = xmlHttp.responseText ; // 接收返回的内容
// 设置msg标签元素中要显示的内容为AJAX接收的返回值内容
document.getElementById("msg").innerHTML = text ;
}
}
}
</script><input type="button" onclick="showMsg()" value="调用AJAX显示内容">
<span id="msg"></span>
</body></html>
总结：
1 使用AJAX可以完成局部刷新操作；
2 在AJAX中主要是通过XMLHttpRequest对象完成操作。
时间： 2024-11-06 18:30:15