AJAX是一中運(yùn)用JavaScript和可擴(kuò)展編輯語言（XML），在網(wǎng)絡(luò)瀏覽器和服務(wù)器之間傳送或接收數(shù)據(jù)的技術(shù)。
AJAX的工作原理相當(dāng)與在用戶和服務(wù)器之間加了一個(gè)中間層，使用戶請(qǐng)求與服務(wù)器響應(yīng)異步化。這樣還可以把以前的一些服務(wù)器負(fù)擔(dān)的工作轉(zhuǎn)交給客戶端，利用客戶端閑置的處理能力來處理，減輕服務(wù)器和寬帶的負(fù)擔(dān)。
AJAX是WEB2.0的核心之一．AJAX技術(shù)運(yùn)用與瀏覽器中，使向服務(wù)器索取網(wǎng)頁的部分信息成為可能．
XMLHttpRequest對(duì)象
XMLHttpRequest提供客戶端同HTTP服務(wù)器異步通信的協(xié)議．通過這個(gè)協(xié)議，AJAX可以使頁面象桌面程序一樣同服務(wù)器端進(jìn)行數(shù)據(jù)層面的交換，而不必每次都刷新頁面，也不用每次都將數(shù)據(jù)處理的工作都交給服務(wù)器來做，這樣既減輕了服務(wù)器負(fù)擔(dān)又加快了響應(yīng)速度，縮短了用戶等待的時(shí)間．
XMLHttpRequest對(duì)象的方法：
Abort() 停止當(dāng)前請(qǐng)求
getAllResponseHeaders() 返回HTTP請(qǐng)求的所有響應(yīng)頭部的鍵/值字符串
getResponseHeader("header") 返回指定頭部屬性的字符串值
Open("method", "url") 建立對(duì)服務(wù)器的調(diào)用。Method參數(shù)可以是GET POST PUT, url參數(shù)可以是相對(duì)URL或絕對(duì)對(duì) URL
Send(content) 向服務(wù)器發(fā)送請(qǐng)求
setRequestHeader("header","value") 為指定頭部屬性設(shè)置指定值
XMLHttpRequest對(duì)象的屬性：
Onreadystatechange 狀態(tài)改變的時(shí)間觸發(fā)器，通常綁定一個(gè)JavaScript 函數(shù)，每當(dāng)狀態(tài)發(fā)生改變時(shí)，就調(diào)用該函數(shù)
readyState 請(qǐng)求的狀態(tài)，有5個(gè)可取值：
0 = 未初始化
1 = 讀取中
2 = 已讀取
3 = 交互中
4 = 完成
responseText 從服務(wù)器返回的文本形式的響應(yīng)內(nèi)容
responseXML 從服務(wù)器返回的兼容DOM的XML文檔對(duì)象
Status 從服務(wù)器返回的狀態(tài)碼，例如404="文件找不到"
200 = "成功"
statusText 從服務(wù)器返回的狀態(tài)文本信息，例如OK或Not Found(未找到)
<script language = "javascript">
//定義一個(gè)將指向XMLHttpRequest對(duì)象的變量
var xmlHttp;
//定義一個(gè)函數(shù)用于創(chuàng)建XMLHttpRequest對(duì)象
function createXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
}
//定義一個(gè)函數(shù)用于啟動(dòng)與服務(wù)器的異步同信
function begin(){
createXMLHttpRequest(); //調(diào)用createXMLHttpRequest函數(shù)
xmlHttp.onreadystatechange = processor; //將事件觸發(fā)器綁定到 processor上
xmlHttp.open("GET", "test.xml"); //使用GET方法建立對(duì)服務(wù)器資 源test.xml的一個(gè)異步調(diào)用
xmlHttp.send(null); //向服務(wù)器發(fā)送請(qǐng)求
}
//定義一個(gè)狀態(tài)處理函數(shù)用于處理狀態(tài)觸發(fā)器的狀態(tài)改變
function processor(){
//如果處理請(qǐng)求完成
if(xmlHttp.readyState == 4){
//如果服務(wù)器返回狀態(tài)為成功
if(xmlHttp.status = 200){
//將從服務(wù)器返回的內(nèi)容報(bào)告給用戶
alert("從服務(wù)器返回的內(nèi)容為：" + xmlHttp.responseText);
}
}
}
</script>
DOM是面向HTML和XML文檔的一組API，它為文檔提供了結(jié)構(gòu)化的表示，并定義了如何通過腳本（JavaScript）來訪問文檔結(jié)構(gòu)。如果沒有DOM，JavaScript根本就不存在Web頁面和構(gòu)成頁面元素的概念。文檔中的每個(gè)元素都是DOM的一部分，可通過JavaScript來訪問這些元素的屬性和方法，實(shí)現(xiàn)動(dòng)態(tài)編輯頁面的功能。
這里所說的DOM是符合W3C標(biāo)準(zhǔn)的文檔對(duì)象模型，它以樹型結(jié)構(gòu)表示HTML和XML文檔，并定義可操作這個(gè)樹及其節(jié)點(diǎn)的一系列方法和屬性。在網(wǎng)絡(luò)瀏覽器端，通過JavaScript利用DOM提供的API來操作HTML和XML文檔。
1.操作HTML文檔
HTML文檔各個(gè)節(jié)點(diǎn)在DOM中被視為個(gè)種類型的Node對(duì)象.而且每個(gè) Node對(duì)象都有自己的屬性和方法,通常利用這些屬性和方法來遍歷或動(dòng)態(tài)編輯整個(gè)樹。
操作HTML文檔的常用DOM方法：
getElementById(isIDValue) 返回文檔中具有指定id屬性的元素
getElementByTabName(isTagName) 返回當(dāng)前元素中有指定標(biāo)記名的子元素 的數(shù)組
appendChild(childNode) 在當(dāng)前節(jié)點(diǎn)的childNodes[]組中增加一個(gè) 節(jié)點(diǎn)childNode
cloneNode(false | true) false表示僅復(fù)制當(dāng)前節(jié)點(diǎn)；true表示復(fù)制 當(dāng)前節(jié)點(diǎn)以及它的所有子孫節(jié)點(diǎn)
hasChildNodes() 判斷當(dāng)前節(jié)點(diǎn)是否擁有子節(jié)點(diǎn)，有則返回 true
insertBefore(newNode,targetNode) 將節(jié)點(diǎn)newNode作為當(dāng)前元素的子節(jié)點(diǎn) 插到targetNode元素前面
removeChild(childNode) 從文檔樹中刪除子節(jié)點(diǎn)childNode
resplaceChild(newNode,oldNode) 將節(jié)點(diǎn)oldNode替換為節(jié)點(diǎn)newNode
getAttribute(sAttrName) 返回指定屬性的字符串值
setAttribute(sAttriName, vAttrValue) 把指定的屬性設(shè)置為鎮(zhèn)定的字符串值，如 果該屬性不存在則添加一個(gè)新屬性
removeAttribute(sAttrName) 從元素中刪除屬性sAttrName
操作HTML文檔的常用DOM屬性：
Attributes 如果該節(jié)點(diǎn)是一個(gè)Element,則以NamedNodeMap 形式返回該元素的屬性
childNodes 以Node[]的形式存放當(dāng)前節(jié)點(diǎn)的子節(jié)點(diǎn)，如果沒 有子節(jié)點(diǎn)，則返回空數(shù)組
firstChild 以Node的形式返回當(dāng)前節(jié)點(diǎn)的第一個(gè)子節(jié)點(diǎn)，如 果沒有子節(jié)點(diǎn)，則為null
lastChild 以Node的形式返回當(dāng)前節(jié)點(diǎn)的最后一個(gè)節(jié)點(diǎn)，如 果沒有子節(jié)點(diǎn)，則為null
nextSibling 以Node的形式返回當(dāng)前節(jié)點(diǎn)的兄弟下一個(gè)節(jié)點(diǎn)， 如果沒有這樣的節(jié)點(diǎn)，則返回null
nodeName 節(jié)點(diǎn)的名字，Element節(jié)點(diǎn)則代表Element的標(biāo)記 名稱
nodeType 代表節(jié)點(diǎn)的類型
parentNode 以Node的形式返回當(dāng)前節(jié)點(diǎn)的父親節(jié)點(diǎn)，如果沒 有父親節(jié)點(diǎn)，則為null
previoiusSibling 以Node的形式返回緊挨當(dāng)前節(jié)點(diǎn)，位于它之前的 兄弟節(jié)點(diǎn)。如果沒有這樣的節(jié)點(diǎn)，則返回null
操作XML文檔
在數(shù)據(jù)的表示和交換方面XML文檔更具優(yōu)勢，針對(duì)XML的訪問和操作，DOM也用樣提供了一系列的API。利用這些API，可方便地從XML文檔中讀取數(shù)據(jù)信息，動(dòng)態(tài)創(chuàng)建展示這些數(shù)據(jù)信息的HTML頁面。
操作XML文檔，通常遵循以下4個(gè)步驟：
載入整個(gè)XML文檔
從XML文檔中提取數(shù)據(jù)信息
對(duì)提取的信息進(jìn)行加工處理
創(chuàng)建包含處理結(jié)果的HTML頁面展示給用戶
遍歷XML文檔的常用DOM方法:
getElementById(sIDValue) 返回文檔中具體指定id屬性的元素
getElementByTabName(sTagName) 返回當(dāng)前元素中有指定標(biāo)記名的子元素的數(shù) 組
hasChildNodes() 判斷當(dāng)前節(jié)點(diǎn)是否擁有子節(jié)點(diǎn),有則返回true getAttribute(sAttrName) 返回指定屬性的字符串值
操作XML文檔的常用DOM屬性:
childNodes 以Node[]的形式存放當(dāng)前節(jié)點(diǎn)的子節(jié)點(diǎn),如果沒有子節(jié)點(diǎn),則 返回空數(shù)組
firstChild 以Node的形式返回當(dāng)前節(jié)點(diǎn)的第一個(gè)子節(jié)點(diǎn),如果沒有子 節(jié)點(diǎn),則為null
lastChild 以Node的形式返回當(dāng)前節(jié)點(diǎn)的最后一個(gè)子節(jié)點(diǎn),如果沒有 這樣的節(jié)點(diǎn),則返回null
nextSibling 以Node的形式返回當(dāng)前節(jié)點(diǎn)的兄弟下一個(gè)節(jié)點(diǎn)， 如果沒有這樣的節(jié)點(diǎn)，則返回null
nodeName 節(jié)點(diǎn)的名字，Element節(jié)點(diǎn)則代表Element的標(biāo)記 名稱
nodeType 代表節(jié)點(diǎn)的類型
parentNode 以Node的形式返回當(dāng)前節(jié)點(diǎn)的父親節(jié)點(diǎn)，如果沒 有父親節(jié)點(diǎn)，則為null
previoiusSibling 以Node的形式返回緊挨當(dāng)前節(jié)點(diǎn)，位于它之前的 兄弟節(jié)點(diǎn)。如果沒有這樣的節(jié)點(diǎn)，則返回null
本站僅提供存儲(chǔ)服務(wù)，所有內(nèi)容均由用戶發(fā)布，如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請(qǐng)
點(diǎn)擊舉報(bào)。
