ReadyState屬性：
0=未初始化 1=初始化 2=發送資料 3=資料傳送中 4=完成
responseText 屬性：
1、2=responseText是個Null 字元串 3=正在接收 4=接收完成
responseXML屬性：
執行過send()後，如果返回正確的xml格式資料，可以使用XMLHttpRequest接收返回的資料。responseXML可以把返回資訊格式化為XML Document對象，類型為text/xml 如果不包含則返回null。
status屬性：
屬性send()後，可以屬性status接收讀取事物狀態，只有ReadyState為3、4時可以使用這個屬性，否則讀取status時將會發生錯誤。常見的有以下幾個：
100=客戶必須繼續發出請求 200=交易成功 400=錯誤請求 403=請求不允許 404=沒有發現檔案，查詢或URL 500=伺服器內部錯誤 502=伺服器暫不可用 505=伺服器不支援或拒絕要求標頭中指定的HTTP版本。
statusText屬性：
send()方法後，通過statusText讀取事務狀態，statusText返回當前HTTP請求的狀態行，只有當readyState為3 4時才可以使用這個屬性，否則發生錯誤。
onreadystatechange事件：
這個事件屬性值發生變化時所要執行的操作。
abort()方法：
停止一個XMLHttpRequest對象對HTTP的請求，把該對象恢複到初始狀態。
open()方法：
建立一個新的HTTP請求，並指定方法，URL及驗證資訊等，文法是: xmlHttp.open(method,url,mode,user,psd);
method表示要求方法，有post, get, put等，忽略大小寫。url是目的地址，mode是不二型別參數，指定請求是否為非同步方式，預設為true。
調用open()方法後，readyState屬性設定為1.
send()辦法：
xmlHttp.send(content);content是要發送的內容，沒有可以忽略。
setRequestHeader()方法：
setRequestHeader(header, value)設定單個HTTP頭資訊，當readyState為1時，可以在open()後調用此方法，否則將返回一個異常，如果已存在則原來的將覆蓋。value用樣是一個字串型資料，表示頭名稱的值。
getResponseHeader()方法：
通過讀取首部資訊，可以讀取到content-type（內容類型）, content-length（內容長度）, last-modify（最後一次修改）日期等，根據具體網站不同。
getAllResponseHeaders()方法：
獲得全部的首部資訊。
接下來舉個例子，就是擷取頭資訊的： 複製代碼 代碼如下:<html>
<head>
<title>Ajax test</title>
<script type="text/javascript">
var xmlHttp=false;
var headType="";
function createXmlRequest(){
if(window.ActiveObject){ // IE
try{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){
window.alert("create XML Request failed "+e);
}
}
}else if(window.XMLHttpRequest){ // FF
xmlHttp=new XMLHttpRequest();
}
if(!xmlHttp){
window.alert("create XML Request failed");
}
}
function HeadRequst(request){
createXmlRequest();
headType=request;
xmlHttp.onreadystatechange=getHeadInfo; //註冊回呼函數不用括弧。
xmlHttp.open("HEAD","http://www.baidu.com/",false);
xmlHttp.send(null);
}
function getHeadInfo(){
var span=document.getElementById("state");
if(xmlHttp.readyState==4){
if(headType=="All")
span.innerHTML=xmlHttp.getAllResponseHeaders();
else{
span.innerHTML=headType+": "+xmlHttp.getResponseHeader(headType);
}
}
}
</script>
</head>
<body>
<center>
<input type="button" onclick="HeadRequst('Content-Type')" value="Content-type"><br><br>
<input type="button" onclick="HeadRequst('Date')" value="Date"><br><br>
<input type="button" onclick="HeadRequst('Connection')" value="Connection"><br><br>
<input type="button" onclick="HeadRequst('All')" value="All headers"><br>
<br><br><br>
<span id="state"></span><br>
</center>
<body>
</html>
這個例子在IE下工作很順利，在FF下死活出不來，MS原因是FF不支援ActiveX。。。求高手解決下。。。囧rz
JSON
JSON的全稱是：javascript object notation 對象標誌。它是一種輕量級的基於文本並且和語言無關的資料交換格式。和XML類似，是一種文主要組織格式，具體是這樣的，比如我們有一組資料，用xml的話：
<user>
<name>Dumpling</name> <gender>Famle</gender><age>22<age>
<user>
那麼如果用JSON的格式，就是：
"user":[{"name":"Dumpling", "gender":"Famle", "age":22}]
優點就是它可以簡化擷取的資料的解析和儲存等工作。
如果上面的例子再寫複雜一點，就可以看到JSON的具體格式了，我們在JS中聲明的時候，就可以這麼寫： 複製代碼 代碼如下:var users={
"users":[
{"name":"Dumpling", "gender":"Famle", "age":22},
{"name":"Sanday", "gender":"Famle", "age":20},
{"name":"Shine", "gender":"Famle", "age":18}
]};
使用JSON封裝資料，用到的是JSON.stringify(obj)的方法。obj自己封裝一個類就可以。
不需要我們自己來寫字串，只要給值，然後用函數封裝就可以了。來個簡單的例子： 複製代碼 代碼如下:<html>
<head>
<title>testing</title>
<script language="javascript">
function user(name,age,gender){
this.userName=name;
this.userAge=age;
this.userGender=gender;
}
function submidForm(){
var subForm=document.jsonForm;
var userTable=document.getElementById("users");
var newRow=userTable.insertRow(-1);// insert one row at the end of table
newRow.insertCell(0).innerHTML=subForm.name.value;
newRow.insertCell(1).innerHTML=subForm.gender.value;
newRow.insertCell(2).innerHTML=subForm.age.value;
var newuser=new user(subForm.name.value,subForm.age.value,subForm.gender.value);
var jsonStr=JSON.stringify(newuser);
alert(jsonStr);
subForm.name.value="";
subForm.age.value="";
}
</script>
</head>
<body>
<center>
<form method="POST" action="#" name=jsonForm>
<table border="1" id="newuser">
<tr>
<td>Name: </td><td><input type="text" name="name"></td>
<td>Gender: </td>
<td><select name="gender">
<option value="Famle">Famle</option>
<option value="Male">Male</option>
</select>
</td>
<td>Age: </td><td><input type="text" name="age"></td>
</tr>
<tr>
<td colspan="6" align="center">
<input type="button" id="submit" value="Submit" onclick="submidForm()"></input></td>
</tr>
</table>
</form>
<table id="users" border="1" width="450">
<tr><td>Name</td><td>Gender</td><td>Age</td>
</table>
</center>
</body>
</html>
害怕太長我就遮起來了，反正結果是這樣子滴:
當然，如果要一次封裝很多，比如提交了5 6個使用者然後一次封裝成JSON格式，可以把這幾個放到一個Arry裡，然後把arry作為stringify的參數就可以，自己試一下吧~我就不上代碼了~
在JS中對JSON解析和賦值
這一塊就算是json的中心了，對他的解析其實很簡單的，比如還是之前的例子，
複製代碼 代碼如下:var usersJson={那麼我要得到sanday這個值，就可以這麼寫：var username=uersJson.users[1].name; 會了這一個，別的也沒問題了吧~
如果要修改資料，那麼就是直接賦值，比如我要修改那個食物的價格 userJson.objects[0].price=43;
至於判斷輸入是否合法之類的，我就懶得寫了，費時間。
JSON就到這裡，接下來最後一部分了。
Prototype架構
先上一下prototype的網站：http://www.prototypejs.org/
它其實就是對JS做了大量的拓展，大體由通用方法與模板兩部分構成的。通用方法比如說$() $$() $A()等，模板則是對JS內部類進行拓展，並提供對Ajax的各種應用的支援模板。具體大家可以上給出的網站看看。舉倆例子，再多請到API頁面查看：http://api.prototypejs.org/ (是啊 我很懶的╮(╯▽╰)╭)
$()方法：擷取元素對象，類似於getElementById方法，並且可以接受多個參數，返回一個數組。
$$()方法：擷取指定元素數組，類似與getElementByTagName()方法，根據標籤名擷取對象。
Ajax對象：剛才我們也說過了，因為瀏覽器不同，我們需要寫大量的判斷代碼，於是prototype就給我們代勞了，Ajax.Request對象封裝了建立XMLHttpRequest對象的代碼，以及各種處理伺服器返回資訊的常用方法，所以還是很好用的。想要深入學習的話，請繼續參考上面的API連結 (= =!)
form對象：因為真的很常用，於是form也是prototype重點關注的對象，這部分 很重要，於是可以參考API的相關部分。。。。。。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
