001 AJAX核心操作
① ajax的主要作用
局部刷新：实现布局内容变更。如DLBBS中实现昵称的修改。
② 掌握XMLHttpRequest对象的作用、前提、创建和使用
作用：通过该对象处理发送异步请求和处理回应。
前提：要使用该对象必须满足
若使用IE,则版本必须大于IE5[在IE5+以ActiveX组件形式出现]
必须使用JS
必须在服务器上使用，也就是要将编写好的文件通过url的方式访问。
如果直接双击文件打开访问，则会提示网页上有错，文件被拒绝访问。
创建：
<script languange="text/javascript">
var xmlHttp;
function createXMLHttpRequest(){
//判断浏览器类型
if(window.XMLHttpRequest){
//firefox
xmlHttp = new XMLHttpRequst();
}else{
//IE
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
</script>
使用：通过操作XMLHttpRequest对象的属性和方法来使用XMLHttpRequest对象。
（1）重要的属性
1）onreadystatechange() 指定回调函数
回调函数作用：调用回调函数后，将响应返回的内容[text/xml等]通过innerHTML方式返回给用户。
以下属性只读
2）readState 返回当前请求的状态
0 请求未发出[调用open()函数之前]
1 请求已建立但未发出[调用send()函数之前]
2 请求已发出正在处理[可从响应得到内容头部]
3 请求已处理正在接收服务器信息[响应中有部分数据可用，但还未完成全部响应]
4 响应完成，可以访问并使用该服务器响应。
3）responseText 接受普通文本数据
4）responseXML 接受以XML文档形式返回的数据
5）status 返回当前请求的HTTP状态码
（2）重要的方法
abort() 取得当前所发出的请求
setRequestHeader()设置一个指定请求的HTTP头信息
getResponseHeader() 取得一个指定的HTTP头信息
getAllResponseHeaders() 取得所有的HTTP头信息
open() 创建一个HTTP请求，并指定请求模式[get/post]
send() 将创建的请求发送到服务器端，并接收回应信息
例子：
content.htm
hello_world!
ajax_recieve_content.htm
<html> <head> <title>www.mldnjava.cn，MLDN高端Java培训</title> <script language="javascript"> var xmlHttp ;
//1 创建XMLHttpRequest对象 function createXMLHttp(){ if(window.XMLHttpRequest){ xmlHttp = new XMLHttpRequest() ; } else { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") ; } }
//2 被调函数 function showMsg(){ // 创建XMLHttp对象 createXMLHttp() ; //创建一个HTTP请求，并指定发送方式 xmlHttp.open("POST","content.htm") ; // 设置操作的回调函数 格式：调用函数名称+Callback xmlHttp.onreadystatechange = showMsgCallback ; //发送创建的请求并接收回应信息 null表示不发送参数 xmlHttp.send(null) ; } //3 回调函数 function showMsgCallback(){ // 回调操作函数 if(xmlHttp.readyState == 4){ // 调用完成 if(xmlHttp.status == 200){ // HTTP状态码操作正常 var text = xmlHttp.responseText ; document.getElementById("msg").innerHTML = text ; } } } </script> </head> <body> <input type="button" onClick="showMsg()" value="调用AJAX显示内容"> <span id="msg"></span> </body> </html>
函数执行过程：单击按钮后，会出发showMsg()这个js函数，然后这个函数先是调用createXMLHttp()实例化一个xmlHttp对象，然后通过这个对象来调用open方法创建HTTP请求和send方法发出HTTP请求，并指定回调函数showMsgCallback()。回调函数在调用时一旦检测到调用完成且成功返回的这个状态，就会把相关的信息通过innerHTML传回到页面显示。这就是ajax的执行过程。
将这两个文件放在服务器目录下通过url形式访问即可。
虽然是静态页面，但是还是要发布到服务器后才能正常访问。
问题：
ajax中如果不判断readstate和status
也就是没有这两个语句
if(xmlHttp.readyState == 4){
if(xmlHttp.status == 200){
则回调函数会被调用三次
这是为什么？
猜想：可能是因为判断readstate调用一次/判断status调用一次/调用操作又调用一次