推薦：解讀AJAX的跨域名訪問
標(biāo)題有些唬人的成分，因?yàn)檫@里跨的只是子域名。 事情的經(jīng)過是這樣的，還是那個(gè)個(gè)人門戶網(wǎng)站。其中有個(gè)功能就是RSS訂閱，每個(gè)訂閱作為一個(gè)模塊出現(xiàn)在頁面上。如果一個(gè)用戶訂閱了比較多的RSS，則在打開頁面時(shí)所有的RSS模塊就會(huì)開始加載，這時(shí)候可能就會(huì)需要十

到了ajax關(guān)鍵時(shí)刻了。

/* ===========================================================
* 函數(shù)名稱：ajaxUpdater(tarObj,sMethod,URL,parameters)
* 參數(shù)說明：tarObj - 異步獲取信息希望顯示的目標(biāo)節(jié)點(diǎn)ID
* sMethod - 數(shù)據(jù)提交方法，兩個(gè)可選值get,post

* URL - 提交的目標(biāo)URL地址
* parameters - URL后面接（傳遞）的參數(shù)
* 函數(shù)功能：將異步傳遞的目標(biāo)URL地址返回的信息，無刷新的寫到目標(biāo)
* 節(jié)點(diǎn)(tarObj)中
* 返 回 值：new Error() - 運(yùn)行錯(cuò)誤時(shí)返回一個(gè)報(bào)錯(cuò)信息
* 使用方法：var myAjax = ajaxUpdater(msgBox,"get",URL,para);
============================================================ */
function ajaxUpdater(tarObj,sMethod,URL,parameters){
var oXmlHttp = createXMLHTTPRequest();

oXmlHttp.open(sMethod, URL+parameters, true);
oXmlHttp.onreadystatechange = function () {
if (oXmlHttp.readyState == 4) {
if (oXmlHttp.status == 200) {
if((tarObj)){
(tarObj).innerHTML = oXmlHttp.responseText;
}
else{
return false;
}
}
else {
throw new Error("有一個(gè)錯(cuò)誤產(chǎn)生！");
}
}
}

oXmlHttp.send(null);
}

繞了這么多圈，又回到我們文章開始提到的，現(xiàn)在要開始運(yùn)用XMLHttpRequest對(duì)象的相關(guān)知識(shí)了。

var oXmlHttp = createXMLHTTPRequest();首先是創(chuàng)建XMLHttpRequest對(duì)象，我們使用的是createXMLHTTPRequest()：

/* ===========================================================
* 函數(shù)名稱：createXMLHTTPRequest()
* 參數(shù)說明：無參數(shù)
* 函數(shù)功能：創(chuàng)建XMLHttpRequest對(duì)象
* 返 回 值：XMLHTTPRequest對(duì)象
* 使用方法：var oXmlHttp = createXMLHTTPRequest();
============================================================ */
function createXMLHTTPRequest(){
// 非IE瀏覽器（Firefox,Opera）,XMLHttpRequest對(duì)象是瀏覽器內(nèi)置的一個(gè)對(duì)象
if (useXmlHttp){
return new XMLHttpRequest();
}
else if (useActiveX) { //在IE（IE< 7.0 = use ActiveX）瀏覽器中，XMLHttpRequest對(duì)象是以ActiveX控件的形式存在的
if (!XMLHTTP_VER) {
for (var i=0; i < ARR_XMLHTTP_VERS.length; i++){
try {
new ActiveXObject(ARR_XMLHTTP_VERS[i]);
XMLHTTP_VER = ARR_XMLHTTP_VERS[i]; // 獲取本地IE瀏覽器相應(yīng)的XMLHttpRequest對(duì)象版本
break;
} catch (oError) {}
}
}
if (XMLHTTP_VER) {
return new ActiveXObject(XMLHTTP_VER);
}
else {
throw new Error("無法創(chuàng)建XMLHttpRequest對(duì)象！");
}
}
else {
throw new Error("您的瀏覽器不支持XMLHttpRequest對(duì)象！");
}
}

不同的瀏覽器XMLHttpRequest對(duì)象存在的形式不同，還有版本問題，哎，多寫點(diǎn)代碼來兼容吧。

// 方法：open
// 創(chuàng)建一個(gè)新的http請(qǐng)求，并指定此請(qǐng)求的方法、URL以及驗(yàn)證信息
// 語法：oXMLHttpRequest.open(bstrMethod, bstrUrl, varAsync, bstrUser, bstrPassword);
// 參數(shù)
// bstrMethod
// http方法，例如：POST、GET、PUT及PROPFIND。大小寫不敏感。

// bstrUrl
// 請(qǐng)求的URL地址，可以為絕對(duì)地址也可以為相對(duì)地址?

// varAsync[可選]
// 布爾型，指定此請(qǐng)求是否為異步方式，默認(rèn)為true。如果為真，當(dāng)狀態(tài)改變時(shí)會(huì)調(diào)用onreadystatechange屬性指定的回調(diào)函數(shù)。

// bstrUser[可選]
// 如果服務(wù)器需要驗(yàn)證，此處指定用戶名，如果未指定，當(dāng)服務(wù)器需要驗(yàn)證時(shí)，會(huì)彈出驗(yàn)證窗口。

// bstrPassword[可選]
// 驗(yàn)證信息中的密碼部分，如果用戶名為空，則此值將被忽略。

// 備注：調(diào)用此方法后，可以調(diào)用send方法向服務(wù)器發(fā)送數(shù)據(jù)。 xmlhttp.Open("get", "http://localhost/example.htm", false);
// var book = xmlhttp.responseXML.selectSingleNode("//book[@id='bk101']");
// alert(book.xml);

oXmlHttp.open(sMethod, URL+parameters, true);

這里就是我們常說的異步提交，一般常用的也就是我這里用的3個(gè)參數(shù)提交方法（get和post兩個(gè)值），URL地址(URL+parameters,例子里的完整地址就是tarObj + "/" + tarObj + objId + ".htm?d=" + Math.random();)，第三個(gè)(true,false)指定此請(qǐng)求是否為異步方式，默認(rèn)為true。如果為真，當(dāng)狀態(tài)改變時(shí)會(huì)調(diào)用onreadystatechange屬性指定的回調(diào)函數(shù)。

oXmlHttp.onreadystatechange = function () {
// 屬性：readyState
// 返回XMLHTTP請(qǐng)求的當(dāng)前狀態(tài)
// 語法：lValue = oXMLHttpRequest.readyState;
// 備注：變量，此屬性只讀，狀態(tài)用長(zhǎng)度為4的整型表示.定義如下：
// 0 (未初始化) 對(duì)象已建立，但是尚未初始化（尚未調(diào)用open方法）
// 1 (初始化) 對(duì)象已建立，尚未調(diào)用send方法
// 2 (發(fā)送數(shù)據(jù)) send方法已調(diào)用，但是當(dāng)前的狀態(tài)及http頭未知
// 3 (數(shù)據(jù)傳送中) 已接收部分?jǐn)?shù)據(jù)，因?yàn)轫憫?yīng)及http頭不全，這時(shí)通過responseBody和responseText獲取部分?jǐn)?shù)據(jù)會(huì)出現(xiàn)錯(cuò)誤，
// 4 (完成) 數(shù)據(jù)接收完畢,此時(shí)可以通過通過responseBody和responseText獲取完整的回應(yīng)數(shù)據(jù)
if (oXmlHttp.readyState == 4) {
// 屬性：status
// 返回當(dāng)前請(qǐng)求的http狀態(tài)碼
// 語法：lValue = oXMLHttpRequest.status;
// 返回值：長(zhǎng)整形標(biāo)準(zhǔn)http狀態(tài)碼，定義如下：
// Number:Description
// 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
// 備注：長(zhǎng)整形，此屬性只讀，返回當(dāng)前請(qǐng)求的http狀態(tài)碼,此屬性僅當(dāng)數(shù)據(jù)發(fā)送并接收完畢后才可獲取。
if (oXmlHttp.status == 200) {
// 屬性：responseBody
// 返回某一格式的服務(wù)器響應(yīng)數(shù)據(jù)
// 語法：strValue = oXMLHttpRequest.responseBody;
// 備注：變量，此屬性只讀，以u(píng)nsigned array格式表示直接從服務(wù)器返回的未經(jīng)解碼的二進(jìn)制數(shù)據(jù)。
alert(xmlhttp.responseBody);

// 屬性：responseStream
// 以Ado Stream對(duì)象的形式返回響應(yīng)信息
// 語法：strValue = oXMLHttpRequest.responseStream;
// 備注：變量，此屬性只讀，以Ado Stream對(duì)象的形式返回響應(yīng)信息。
alert(xmlhttp.responseStream);

// 屬性：responseText
// 將響應(yīng)信息作為字符串返回
// 語法：strValue = oXMLHttpRequest.responseText;
// 備注：變量，此屬性只讀，將響應(yīng)信息作為字符串返回。XMLHTTP嘗試將響應(yīng)信息解碼為Unicode字符串，
// XMLHTTP默認(rèn)將響應(yīng)數(shù)據(jù)的編碼定為UTF-8，如果服務(wù)器返回的數(shù)據(jù)帶BOM(byte-order mark)，XMLHTTP可
// 以解碼任何UCS-2 (big or little endian)或者UCS-4 數(shù)據(jù)。注意，如果服務(wù)器返回的是xml文檔，此屬
// 性并不處理xml文檔中的編碼聲明。你需要使用responseXML來處理。
alert(xmlhttp.responseText);

// 屬性：responseXML
// 將響應(yīng)信息格式化為Xml Document對(duì)象并返回
// 語法：var objDispatch = oXMLHttpRequest.responseXML;
// 備注：變量，此屬性只讀，將響應(yīng)信息格式化為Xml Document對(duì)象并返回。如果響應(yīng)數(shù)據(jù)不是有效的XML文檔，
// 此屬性本身不返回XMLDOMParseError，可以通過處理過的DOMDocument對(duì)象獲取錯(cuò)誤信息。

(tarObj).innerHTML = oXmlHttp.responseText;
}
}
}

本來想偷個(gè)懶，讓大家看我上邊說的那篇文章，想想也就是Ctrl+C&Ctrl+V,都貼出來吧！呵呵�。。�

不過還沒有完，最后要說的就是innerHTML這個(gè)特性，這里我們還要感謝微軟啊，innerHTML就是它的專利，我們就是用它來改變指定DOM內(nèi)的HTML字符串的，而不用刷新頁面。詳細(xì)的信息大家還是google一下吧，我也要休息下�。。『瓤诓柘龋。�^-^！

以上講了這么多，我們最后來看看，我們這個(gè)ajax標(biāo)簽導(dǎo)航都用到了那些技術(shù)吧：

1. xhtml
2. CSS
3. Javascript
4. DOM
5. XMLHttpRequest對(duì)象
6. innerHTML

還有XML，我們這個(gè)例子沒有涉及到。東西雖小，包含的（web前端開發(fā)）知識(shí)可是都用到了�。�

分享：解決ajax緩存的三種方法
ajax緩存解決 有1,2,3種辦法： 1、加個(gè)隨機(jī)數(shù) ASP隨機(jī)函數(shù) xmlHttp.open(GET, ajax.asp?now= + new Date().getTime(), true); 2、在要異步獲取的asp頁面中寫一段禁止緩存的代碼： Response.Buffer =True Response.ExpiresAbsolute =Now() - 1 Response.E