AJAX

客户端通过javascript脚本获取服务器端的文本,通过解析返回值,更新部分的网页内容。

XMLHttpRequest 对象

try{ // Firefox, Opera 8+, Safari

  xmlObj = new XMLHttpRequest();
}

catch(e){

  try{ // IE5+

    xmlObj = new ActiveXObject("Msxml2.XMLHTTP");
  }

  catch(e){

    try{

      xmlObj = new ActiveXObject("Microsoft.XMLHTTP");
    }

    catch(e){

      alert("您的浏览器不支持ajax");

    }

  }

}

属性 描述
onreadystatechange 指定当readyState属性改变时的事件处理句柄
readyState 返回 XMLHTTP 请求的当前状态
responseBody 返回某一格式的服务器响应数据
responseStream 以 Ado Stream 对象的形式返回响应信
responseText 将响应信息作为字符串返回

XMLHTTP 尝试将响应信息解码为 Unicode 字符串,XMLHTTP 默认将响应数据的编码定为 UTF-8,如果服务器返回的数据带 BOM(byte -order mark),XMLHTTP 可以解码任何 UCS-2 (big or little endian)或者 UCS-4 数据。注意,如果服务器返回的是 xml 文档,此属性并不处理 xml 文档中的编码声明。你需要使用 responseXML 来处理。

responseXML 将响应信息格式化为 Xml Document 对象并返回

如果响应数据不是有效的XML文档,此属性本身不返回XMLDOMParseError,可以通过处理过的DOMDocument对象获取错误信息。

status 返回当前请求的 HTTP 状态码, 长整形

仅当数据发送并接收完毕后才可获取。

statusText 返回当前请求的响应行状态
方法 描述
abort() 取消当前请求
getallresponseheaders() 获取响应的所有 HTTP 头

每个http头名称和值用冒号分割,并以\r\n结束。
当 send 方法完成后才可调用该方法。

getResponseHeader("Content-Type") 从响应信息中获取指定的 HTTP 头,"text/xml"
open(...) 创建一个新的 HTTP 请求,并指定此请求的方法、URL以及验证信息
send(varBody) 发送请求到http服务器并接收回应

此方法的同步或异步方式取决于open方法中的bAsync参数,如果bAsync == False,此方法将会等待请求完成或者超时时才会返回,如果bAsync == True,此方法将立即返回。

setRequestHeader() 单独指定请求的某个 HTTP 头

open 方法

open(strMethod, strUrl, blnAsync, strUser, strPassword)
方法 描述
strMethod http方法,例如:POST、GET、PUT及PROPFIND。不区分大小写。
strUrl 请求的URL地址,可以为绝对地址也可以为相对地址。
blnAsync 布尔型,指定此请求是否为异步方式,默认为true。如果为真,当状态改变时会调用onreadystatechange属性指定的回调函数。
async是一个布尔值。如果是异步通信方式(true),客户机就不等待服务器的响应;如果是同步方式(false),客户机就要等到服务器返回消息后才去执行其他操作。我们需要根据实际需要来指定同步方式,在某些页面中,可能会发出多个请求,甚至是有组织有计划有队形大规模的高强度的request,而后一个是会覆盖前一个的,这个时候当然要指定同步方式:Flase。
strUser 如果服务器需要验证,此处指定用户名,如果未指定,当服务器需要验证时,会弹出验证窗口。
strPassword 验证信息中的密码部分,如果用户名为空,则此值将被忽略。

readyState 属性

描述
0 (未初始化) 对象已建立,但是尚未初始化(尚未调用open方法)
1 (初始化) 对象已建立,尚未调用send方法
2 (发送数据) send方法已调用,但是当前的状态及http头未知
3 (数据传送中) 已接收部分数据,因为响应及http头不全,
这时通过responseBody和responseText获取部分数据会出现错误,
4 (完成) 数据接收完毕,此时可以通过通过responseBody和responseText获取完整的回应数据

status 属性

描述
100 Continue
101 Switching protocols
200 OK
201 Created
202 Accepted
203 Non-Authoritative Information
204 No Content
205 Reset Content
206 Partial Content
300 Multiple Choices
301 Moved Permanently
302 Found
303 See Other
304 Not Modified
305 Use Proxy
307 Temporary Redirect
400 Bad Request
401 Unauthorized
402 Payment Required
403 Forbidden
404 Not Found
405 Method Not Allowed
406 Not Acceptable
407 Proxy Authentication Required
408 Request Timeout
409 Conflict
410 Gone
411 Length Required
412 Precondition Failed
413 Request Entity Too Large
414 Request-URI Too Long
415 Unsupported Media Type
416 Requested Range Not Suitable
417 Expectation Failed
500 Internal Server Error
501 Not Implemented
502 Bad Gateway
503 Service Unavailable
504 Gateway Timeout
505 HTTP Version Not Supported

示例:

function ajax_submit()
{
   var xmlhttp;
   try{
      xmlhttp=new XMLHttpRequest();
   }catch(e){
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
   xmlhttp.onreadystatechange=function() {
      if( 4 == xmlhttp.readyState && 200 == xmlhttp.status )
         set_data( xmlhttp );
   }
   xmlhttp.open("post", "getdata.asp", true);
   xmlhttp.setRequestHeader('Content-type','application/x-www-form-urlencoded');
   xmlhttp.send("title=" + escape("xxx"));
}

function set_data( xmlhttp )
{
   var xml = xmlhttp.responseXML;
   alert(xml.documentElement.childNodes[0].text);
}

<?xml version="1.0" encoding="GB2312"?>
<%
response.ContentType = "text/xml"
response.Charset = "GB2312"

Set xmlDom = Server.CreateObject("Microsoft.FreeThreadedXMLDOM")
Set Root = xmlDom.createElement("root")
Set ChildNode = xmlDom.createElement("title")

ChildNode.text = request.form("title")
Root.appendChild ChildNode
xmlDom.appendChild Root

response.write xmlDom.xml
%>