Ajax (Asynchronous JavaScript and XML)：異步的JavaScript和XML搬瑰。
Ajax不是某種編程語言挽懦，而是一種在無需重新加載整個網(wǎng)頁的情況之下能夠更新部分網(wǎng)頁的技術(shù)。
傳統(tǒng)的網(wǎng)頁（即不用ajax技術(shù)的網(wǎng)頁）想要更新內(nèi)容或者提交一個表單，就要重新載入頁面费封。
而使用了ajax技術(shù)的網(wǎng)頁，通過在后臺跟服務(wù)器進行少量的數(shù)據(jù)交換纬霞，網(wǎng)頁就可以實現(xiàn)異步局部更新募逞。
使用步驟：
1蛋铆、利用html+css來實現(xiàn)頁面，表達信息
2放接、用XMLHttpRequest和web服務(wù)器進行數(shù)據(jù)的異步交換
3戒职、運營js操作DOM，實現(xiàn)動態(tài)局部刷新
//XMLHttpRequest對象創(chuàng)建
var request透乾；
if(window.XMLHttpRequest){
request=new XMLHttpRequest(); //IE7+,Firefox,Chrome,Opera洪燥，Safari
}else{
request=new ActiveXObject（"Microsoft.XMLHTTP"）;//IE6,IE5
}
什么是http？
http是計算機通過網(wǎng)絡(luò)進行通信的規(guī)則乳乌，使客戶端（瀏覽器）可以向web服務(wù)器請求信息和服務(wù)捧韵。
http是一種無狀態(tài)協(xié)議，無狀態(tài)指的是不建立持久的連接汉操，也就是說服務(wù)端不保留一些連接的信息再来。
瀏覽器發(fā)出請求讼庇，服務(wù)器響應(yīng)筛武，連接即斷開桨吊。
一個完整的http請求過程孟岛，通常有7個步驟：
1. 建立TCP連接
2. web瀏覽器向web服務(wù)器發(fā)送請求命令
3. web瀏覽器發(fā)送請求頭信息
4. web服務(wù)器應(yīng)答
5. web服務(wù)器發(fā)送應(yīng)答頭信息
6. web服務(wù)器想瀏覽器發(fā)送數(shù)據(jù)
7. web服務(wù)器關(guān)閉TCP連接
一個http請求一般由四部分組成：
1. http請求的方法或動作，比如是get還是post請求
2. 正在請求的URL针炉，總得知道請求的地址是什么吧
3. 請求頭挠他，包含一些客戶端環(huán)境信息，身份驗證信息等
4. 請求體篡帕，也就是請求正文殖侵，請求正文中可以包含客戶提交的查詢字符串信息，表單信息等等
get請求：一般用于信息獲取镰烧，使用URL傳遞參數(shù)拢军，對所發(fā)信息的數(shù)量也有限制，一般在2000個字符
post請求：一般用于修改服務(wù)器上的資源怔鳖，對所發(fā)信息的數(shù)量無限制茉唉。
一個http響應(yīng)一般由三部分組成：
1. 一個數(shù)字和文字組成的狀態(tài)碼，用來顯示請求是成功還是失敗
2. 響應(yīng)頭结执，響應(yīng)頭也和請求頭一樣包含許多有用的信息度陆，例如服務(wù)器類型、日期時間昌犹、內(nèi)容類型和長度等
3. 相應(yīng)體，也就是響應(yīng)正文
http狀態(tài)碼由3位數(shù)字構(gòu)成览芳，其中首位數(shù)字定義了狀態(tài)碼的類型
1xx：信息類斜姥，表示收到web瀏覽器請求，正在進一步的處理中
2xx：成功沧竟，表示用戶請求被正確接收铸敏，理解和處理例如：200 OK
3xx：重定向，表示請求沒有成功悟泵，客戶必須采取進一步的動作
4xx：客戶端錯誤杈笔，表示客戶端提交的請求有錯誤，例如：404 NOT
Found：意味著請求中所引用的文檔不存在
5xx：服務(wù)器錯誤糕非，表示服務(wù)器不能完成對請求的處理：如 500
open(method,url,async)
send(string)
例：request.open("GET","get.php",true);
request.send();
request.open("POST","post.php",true);
request.send();
request.open("POST","create.php",true);
//要寫在open和send方法之間
request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
request.send("name=張三&sex=男");
實例前端代碼：
<body>
<h1>員工查詢</h1>
<label>請輸入員工編號：</label>
<input type="text" id="keyword" />
<button id="search">查詢</button>
<p id="searchResult"></p>
<h1>員工新建</h1>
<label>請輸入員工姓名：</label>
<input type="text" id="staffName" /><br>
<label>請輸入員工編號：</label>
<input type="text" id="staffNumber" /><br>
<label>請選擇員工性別：</label>
<select id="staffSex">
<option>女</option>
<option>男</option>
</select><br>
<label>請輸入員工職位：</label>
<input type="text" id="staffJob" /><br>
<button id="save">保存</button>
<p id="createResult"></p>
</body>
responseText：獲得字符串形式的響應(yīng)數(shù)據(jù)
responseXML：獲得XML形式的響應(yīng)數(shù)據(jù)
status和statusText：以數(shù)字和文本形式返回http狀態(tài)碼
getAllResponseHeader()：獲取所有的響應(yīng)報頭
getResponseHeader()：查詢響應(yīng)中的某個字段的值
readyState（onreadystatechange通過這個事件監(jiān)聽）屬性：
0：請求未初始化蒙具，open還未調(diào)用
1：服務(wù)器連接已建立，open已經(jīng)調(diào)用了
2：請求已接收朽肥，也就是接收到頭信息了
3：請求處理中禁筏，也就是接收到響應(yīng)主體了
4：請求已完成，且響應(yīng)已就緒衡招，也就是響應(yīng)完成了
例：var request=new XMLHttpRequest();
request.open("GET","get.php",true);
request.send();
request.onreadystatechange = function(){
if(request.readyState===4&&request.status===200)
{
//做一些事情
request.responseText
}
}
實例：
<script>
document.getElementById("search").onclick = function(){
//發(fā)送Ajax查詢請求并處理
var request = new XMLHttpRequest();
request.open("GET","service.php?number="+document.getElementById("keyword").value);
request.send();
request.onreadystatechange = function(){
if(request.readyState === 4){
if(request.status === 200){
document.getElementById("searchResult").innerHTML = request.responseText;
}else{
alert(''發(fā)生錯誤：" + request.status);
}
}
}
}
</script>
實例post：
<script>
document.getElementById("save").onclick = function(){
//發(fā)送Ajax查詢請求并處理
var request = new XMLHttpRequest();
request.open("POST","service.php);
var data = "name=" + document.getElementById("staffName").value
+"&number="+document.getElementById("staffNumber").value
+"&sex="+document.getElementById("staffSex").value
+"&job="+document.getElementById("staffJob").value;
request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
request.send(data);
request.onreadystatechange = function(){
if(request.readyState === 4){
if(request.status === 200){
document.getElementById("createResult").innerHTML = request.responseText;
}else{
alert(''發(fā)生錯誤：" + request.status);
}
}
}
}
</script>
JSON：JavaScript對象表示法（JavaScript Object Notation）
JSON是存儲和交換文本信息的語法篱昔，類似XML。它采用鍵值對的方式來組織，易于人們閱讀和編寫州刽，同時也易于機器解析和生成
JSON是獨立于語言的空执，也就是說不管什么語言，都可以解析JSON穗椅，只需要按照JSON的規(guī)則來就行辨绊。
JSON與XML比較：
JSON的長度相比XML短小
JSON讀寫的速度更快
JSON可以使用JavaScript內(nèi)建的方法直接進行解析，轉(zhuǎn)換成JavaScript對象房待，非常方便
JSON語法規(guī)則：
JSON數(shù)據(jù)的書寫格式：名稱/值對邢羔。
名稱/值對組合中的名稱寫在前面（在雙引號中），值對寫在后面（同樣在雙引號中）桑孩，中間用冒號隔開：比如"name":"張三"
JSON的值可以是下面這些類型：
數(shù)字（整數(shù)或浮點數(shù)）拜鹤，比如123，1.23
字符串（在雙引號中）
邏輯值（true或false）
數(shù)組（在方括號中）
對象（在花括號中）
null
JSON解析：
eval和JSON.parse
在代碼中使用eval是很危險的流椒！特別是用它執(zhí)行第三方的JSON數(shù)據(jù)（其中可能包含惡意代碼）時敏簿，
盡可能使用JSON.parse()方法解析字符串本身，該方法還可以捕捉JSON中的語法錯誤宣虾。
實例：
<script>
document.getElementById("save").onclick = function(){
//發(fā)送Ajax查詢請求并處理
var request = new XMLHttpRequest();
request.open("POST","service.php);
var data = "name=" + document.getElementById("staffName").value
+"&number="+document.getElementById("staffNumber").value
+"&sex="+document.getElementById("staffSex").value
+"&job="+document.getElementById("staffJob").value;
request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
request.send(data);
request.onreadystatechange = function(){
if(request.readyState === 4){
if(request.status === 200){
var data = JSON.parse(request.responseText);
if(data.success){
document.getElementById("createResult").innerHTML = data.msg;
}else{
document.getElementById("createResult").innerHTML = "出現(xiàn)錯誤:" + data.msg;
}
}else{
alert("發(fā)生錯誤：" + request.status);
}
}
}
}
</script>
jQuery.ajax([settings])
type：類型惯裕，“POST”或“GET”，默認為“GET”
url：發(fā)送請求的地址
data：是一個對象绣硝，連同請求發(fā)送到服務(wù)器的數(shù)據(jù)
dataType：預(yù)期服務(wù)器返回的數(shù)據(jù)類型蜻势。如果不指定，jQuery將自動根據(jù)http包MIME信息來智能判斷鹉胖，一般我們采用json格式握玛，可以設(shè)置為"json"
success：是一個方法，請求成功后的回調(diào)函數(shù)甫菠。傳入返回后的數(shù)據(jù)挠铲，以及包含成功代碼的字符串
error：是一個方法，請求失敗時調(diào)用此函數(shù)寂诱。傳入XMLHttpRequest對象
實例：
$(document).ready(function(){
$("#search").click(function(){
$.ajax({
type:"GET",
url:"service.php?number=" + $("#keyword").val(),
dataType:"json",
success: function(data){
if(data.success){
$("#searchResult").html(data.msg);
}else{
$("#searchResult").html("出現(xiàn)錯誤：" + data.msg);
}
},
error: function(jqXHR){
alert("發(fā)生錯誤："+ jqXHR.status);
}
});
});
});
實例post：
$(document).ready(function(){
$("#save").click(function(){
$.ajax({
type:"GET",
url:"service.php",
dataType:"json",
data:{
name:$("#staffName").val(),
number:$("#staffNumber").val(),
sex:$("#staffSex").val(),
job:$("#staffJob").val(),
}
success: function(data){
if(data.success){
$("#createResult").html(data.msg);
}else{
$("#createResult").html("出現(xiàn)錯誤：" + data.msg);
}
},
error: function(jqXHR){
alert("發(fā)生錯誤："+ jqXHR.status);
}
});
});
});
一個域名地址的組成：
http:// www . abc.com : 8080 / scripts/jquery.js
協(xié)議 子域名 主域名 端口號 請求資源地址
當協(xié)議拂苹、子域名、主域名痰洒、端口號中任意一個不相同時瓢棒，都算作不同域
不同域之間相互請求資源，就算做 “跨域”
比如：http://www.abc.com/index.heml 請求 http://www.efg.com/service.php
JavaScript出于安全方面的考慮丘喻，不允許跨域調(diào)用其他頁面的對象音羞。
跨域：簡單地理解就是因為JavaScript同源策略的限制，a.com域名下的js無法操作b.com
或是c.a.com域名下的對象仓犬。
主域名：abc.com
子域名：www.abc.com
bbs.abc.com
beijing.bbs.abc.com
haidian.beijing.bbs.abc.com
子域名不同就是跨域嗅绰！
處理跨域方法一 ------代理（屬于后臺技術(shù)）
通過在同域名的web服務(wù)器端創(chuàng)建一個代理：
北京服務(wù)器（域名：www.beijing.com）
上海服務(wù)器（域名：www.shanghai.com）
比如在北京的web服務(wù)器的后臺 (www.beijing.com/proxy-shanghaiservice.php)來調(diào)用
上海服務(wù)器 (www.shanghai.com/service.php)的服務(wù)，然后再把響應(yīng)結(jié)果返回給前端，
這樣前端調(diào)用北京同域名的服務(wù)就和調(diào)用上海的服務(wù)效果相同了窘面。
處理跨域方法二 ------JSONP（只能處理GET請求）
JSONP可用于解決主流瀏覽器的跨域數(shù)據(jù)訪問的問題翠语，
在www.aaa.com頁面中：
<script>
function jsonp(json){
alert(json["name"]);
}
</script>
<script src = "http://bbb.com/jsonp.js"></script>
在www.bbb.com頁面中：
jsonp({"name":"張三","age":24});
處理跨域方法三 ------XHR2（IE10以下的版本都不支持）
html5提供的XMLHttpRequest level2已經(jīng)實現(xiàn)了跨域訪問以及其他的一些新功能，
但是IE10以下的版本都不支持财边。
只需要在服務(wù)器端做一些小小的改造即可：
1. header("Access-Control-Allow-Origin:域名")
2. header("Access-Control-Allow-Methods:POST,GET")
- 使用load()方法異步請求數(shù)據(jù)
使用load()方法通過Ajax請求加載服務(wù)器中的數(shù)據(jù)肌括，并把返回的數(shù)據(jù)放置到指定的元素中，它的調(diào)用格式為：
load(url,[data],[callback])
參數(shù)url為加載服務(wù)器地址酣难，可選項data參數(shù)為請求時發(fā)送的數(shù)據(jù)谍夭，callback參數(shù)為數(shù)據(jù)請求成功后，
執(zhí)行的回調(diào)函數(shù)憨募。
例如紧索，點擊“加載”按鈕時，向服務(wù)器請求加載一個指定頁面的內(nèi)容菜谣，加載成功后珠漂，
將數(shù)據(jù)內(nèi)容顯示在<div>元素中，并將加載按鈕變?yōu)椴豢捎茫?<body>
<div id="divtest">
<div class="title">
<span class="fl">我最愛吃的水果</span>
<span class="fr">
<input id="btnShow" type="button" value="加載" />
</span>
</div>
<div class="content"></div>
</div>
<script type="text/javascript">
$(function () {
$("#btnShow").bind("click", function () {
var $this = $(this);
$(".content")
.html("")
.load("Data/fruit.html", function () {
$this.attr("disabled", "true");
};)
})
});
</script>
</body>
- 使用getJSON()方法異步加載JSON格式數(shù)據(jù)
使用getJSON()方法可以通過Ajax異步請求的方式尾膊，獲取服務(wù)器中的數(shù)據(jù)媳危，并對獲取的數(shù)據(jù)進行解析，
顯示在頁面中冈敛，它的調(diào)用格式為：
jQuery.getJSON(url,[data],[callback])或$.getJSON(url,[data],[callback])
其中待笑，url參數(shù)為請求加載json格式文件的服務(wù)器地址，可選項data參數(shù)為請求時發(fā)送的數(shù)據(jù)抓谴，
callback參數(shù)為數(shù)據(jù)請求成功后暮蹂，執(zhí)行的回調(diào)函數(shù)。
例如齐邦，點擊頁面中的“加載”按鈕椎侠，調(diào)用getJSON()方法獲取服務(wù)器中JSON格式文件中的數(shù)據(jù)第租，并遍歷數(shù)據(jù)措拇，
將指定的字段名內(nèi)容顯示在頁面中：
<body>
<div id="divtest">
<div class="title">
<span class="fl">我最喜歡的一項運動</span>
<span class="fr">
<input id="btnShow" type="button" value="加載" />
</span>
</div>
<ul></ul>
</div>
<script type="text/javascript">
$(function () {
$("#btnShow").bind("click", function () {
var $this = $(this);
$.getJSON("Data/sport.json", function (data) {
$this.attr("disabled", "true");
$.each(data, function (index, sport) {
$("ul").append("<li>" + sport["name"] + "</li>");
});
});
})
});
</script>
</body>
- 使用getScript()方法異步加載并執(zhí)行js文件
用getScript()方法異步請求并執(zhí)行服務(wù)器中的JavaScript格式的文件，它的調(diào)用格式如下所示：
jQuery.getScript(url,[callback])或$.getScript(url,[callback])
參數(shù)url為服務(wù)器請求地址慎宾，可選項callback參數(shù)為請求成功后執(zhí)行的回調(diào)函數(shù)丐吓。
例如，點擊“加載”按鈕趟据，調(diào)用getScript()加載并執(zhí)行服務(wù)器中指定名稱的JavaScript格式的文件券犁，
并在頁面中顯示加載后的數(shù)據(jù)內(nèi)容：
<body>
<div id="divtest">
<div class="title">
<span class="fl">我最喜歡的運動</span>
<span class="fr">
<input id="btnShow" type="button" value="加載" />
</span>
</div>
<ul></ul>
</div>
<script type="text/javascript">
$(function () {
$("#btnShow").bind("click", function () {
var $this = $(this);
$.getScript("Data/sport.js", function () {
$this.attr("disabled", "true");
});
})
});
</script>
</body>
- 使用get()方法以GET方式從服務(wù)器獲取數(shù)據(jù)
使用get()方法時，采用GET方式向服務(wù)器請求數(shù)據(jù)汹碱，并通過方法中回調(diào)函數(shù)的參數(shù)返回請求的數(shù)據(jù)粘衬，
它的調(diào)用格式如下：
$.get(url,[callback])
參數(shù)url為服務(wù)器請求地址，可選項callback參數(shù)為請求成功后執(zhí)行的回調(diào)函數(shù)。
例如稚新，當點擊“加載”按鈕時勘伺，調(diào)用get()方法向服務(wù)器中的一個.php文件以GET方式請求數(shù)據(jù)，
并將返回的數(shù)據(jù)內(nèi)容顯示在頁面中：
<body>
<div id="divtest">
<div class="title">
<span class="fl">我的個人資料</span>
<span class="fr">
<input id="btnShow" type="button" value="加載" />
</span>
</div>
<ul></ul>
</div>
<script type="text/javascript">
$(function () {
$("#btnShow").bind("click", function () {
var $this = $(this);
$.get("Data/info.php", function (data) {
$this.attr("disabled", "true");
$("ul").append("<li>我的名字叫：" + data.name + "</li>");
$("ul").append("<li>男朋友對我說：" + data.say + "</li>");
}, "json");
})
});
</script>
</body>
- 使用post()方法以POST方式從服務(wù)器發(fā)送數(shù)據(jù)
與get()方法相比褂删，post()方法多用于以POST方式向服務(wù)器發(fā)送數(shù)據(jù)飞醉，服務(wù)器接收到數(shù)據(jù)之后，進行處理屯阀，
并將處理結(jié)果返回頁面缅帘，調(diào)用格式如下：$.post(url,[data],[callback])
參數(shù)url為服務(wù)器請求地址，可選項data為向服務(wù)器請求時發(fā)送的數(shù)據(jù)难衰，可選項callback參數(shù)為請求成功后
執(zhí)行的回調(diào)函數(shù)钦无。
例如，在輸入框中錄入一個數(shù)字召衔，點擊“檢測”按鈕铃诬，調(diào)用post()方法向服務(wù)器以POST方式發(fā)送請求，
檢測輸入值的奇偶性苍凛，并顯示在頁面中：
<body>
<div id="divtest">
<div class="title">
<span class="fl">檢測數(shù)字的奇偶性</span>
<span class="fr"><input id="btnCheck" type="button" value="檢測" /></span>
</div>
<ul>
<li>請求輸入一個數(shù)字 <input id="txtNumber" type="text" size="12" /></li>
</ul>
</div>
<script type="text/javascript">
$(function () {
$("#btnCheck").bind("click", function () {
$.post("Data/check.php", {
num: $("#txtNumber").val()
},
function (data) {
$("ul").append("<li>你輸入的<b> "
+ $("#txtNumber").val() + " </b>是<b> "
+ data + " </b></li>");
});
})
});
</script>
</body>
使用serialize()方法可以將表單中有name屬性的元素值進行序列化趣席，生成標準URL編碼文本字符串，
直接可用于ajax請求醇蝴，它的調(diào)用格式如下：
$(selector).serialize()
其中selector參數(shù)是一個或多個表單中的元素或表單元素本身宣肚。
例如，在表單中添加多個元素悠栓，點擊“序列化”按鈕后霉涨，調(diào)用serialize()方法，將表單元素序列化后的
標準URL編碼文本字符串顯示在頁面中：
<body>
<div id="divtest">
<div class="title">
<span class="fl">我的個人資料</span>
<span class="fr">
<input id="btnAction" type="button" value="序列化" />
</span>
</div>
<form action="">
<ul>
<li>姓名：<input name="Text1" type="text" size="12" /></li>
<li>
<select name="Select1">
<option value="0">男</option>
<option value="1">女</option>
</select>
</li>
<li><input name="Checkbox1" type="checkbox" />資料是否可見 </li>
<li id="litest"></li>
</ul>
</form>
</div>
<script type="text/javascript">
$(function () {
$("#btnAction").bind("click", function () {
$("#litest").html($("form").serialize());
})
})
</script>
</body>
- 使用ajax()方法加載服務(wù)器數(shù)據(jù)
使用ajax()方法是最底層惭适、功能最強大的請求服務(wù)器數(shù)據(jù)的方法笙瑟，它不僅可以獲取服務(wù)器返回的數(shù)據(jù)，
還能向服務(wù)器發(fā)送請求并傳遞數(shù)值癞志，它的調(diào)用格式如下：
jQuery.ajax([settings])或$.ajax([settings])
其中參數(shù)settings為發(fā)送ajax請求時的配置對象往枷，在該對象中，url表示服務(wù)器請求的路徑凄杯，
data為請求時傳遞的數(shù)據(jù)错洁，dataType為服務(wù)器返回的數(shù)據(jù)類型，success為請求成功的執(zhí)行的回調(diào)函數(shù)戒突，
type為發(fā)送數(shù)據(jù)請求的方式屯碴，默認為get。
例如膊存，點擊頁面中的“加載”按鈕导而，調(diào)用ajax()方法向服務(wù)器請求加載一個txt文件忱叭，
并將返回的文件中的內(nèi)容顯示在頁面：
<body>
<div id="divtest">
<div class="title">
<span class="fl">加載一段文字</span>
<span class="fr">
<input id="btnCheck" type="button" value="檢測" />
</span>
</div>
<ul></ul>
</div>
<script type="text/javascript">
$(function () {
$("#btnShow").bind("click", function () {
$.ajax({
url: "Data/article.txt",
dataType: "text",
success: function (data) {
$this.attr("disabled","true");
$("ul").append(data);
}
});
})
});
</script>
</body>
- 使用ajaxSetup()方法設(shè)置全局Ajax默認選項
使用ajaxSetup()方法可以設(shè)置Ajax請求的一些全局性選項值，設(shè)置完成后今艺，后面的Ajax請求將不需要
再添加這些選項值窑多，它的調(diào)用格式為：
jQuery.ajaxSetup([options])或$.ajaxSetup([options])
可選項options參數(shù)為一個對象，通過該對象設(shè)置Ajax請求時的全局選項值洼滚。
例如埂息，先調(diào)用ajaxSetup()方法設(shè)置全局的Ajax選項值，再點擊兩個按鈕遥巴，分別使用ajax()方法請求不同
的服務(wù)器數(shù)據(jù)千康，并將數(shù)據(jù)內(nèi)容顯示在頁面：
<body>
<div id="divtest">
<div class="title">
<span class="fl">加載一段文字</span>
<span class="fr">
<input id="btnShow_1" type="button" value="加載1" />
<input id="btnShow_2" type="button" value="加載2" />
</span>
</div>
<ul> </ul>
</div>
<script type="text/javascript">
$(function () {
$.ajaxSetup({
dataType: "text",
success: function (data) {
$("ul").empty().append(data);
}
});
$("#btnShow_1").bind("click", function () {
$.ajax({
url: "Data/article_1.txt"
});
})
$("#btnShow_2").bind("click", function () {
$.ajax({
url: "Data/article_2.txt"
});
})
});
</script>
</body>
- 使用ajaxStart()和ajaxStop()方法
ajaxStart()和ajaxStop()方法是綁定Ajax事件。ajaxStart()方法用于在Ajax請求發(fā)出前觸發(fā)函數(shù)铲掐，
ajaxStop()方法用于在Ajax請求完成后觸發(fā)函數(shù)拾弃。它們的調(diào)用格式為：
$(selector).ajaxStart(function())和$(selector).ajaxStop(function())
其中，兩個方法中括號都是綁定的函數(shù)摆霉，當發(fā)送Ajax請求前執(zhí)行ajaxStart()方法綁定的函數(shù)豪椿，
請求成功后，執(zhí)行ajaxStop ()方法綁定的函數(shù)携栋。
jQuery工具類函數(shù)
在jQuery中搭盾，通過$.browser對象可以獲取瀏覽器的名稱和版本信息，如$.browser.chrome為true婉支，
表示當前為Chrome瀏覽器鸯隅，$.browser.mozilla為true，表示當前為火狐瀏覽器向挖，
還可以通過$.browser.version方式獲取瀏覽器版本信息蝌以。
例如，調(diào)用$.browser對象何之，獲取瀏覽器名稱并顯示在頁面中：
<body>
<div id="divtest">
<div class="title">
<span class="fl">獲取瀏覽器名稱</span>
</div>
<div class="content"></div>
</div>
<script type="text/javascript">
$(function () {
var strTmp = "您的瀏覽器名稱是：";
if ($.browser.chrome) { //谷歌瀏覽器
strTmp += "Chrome";
}
if ($.browser.mozilla) { //火狐相關(guān)瀏覽器
strTmp += "Mozilla FireFox";
}
$(".content").html(strTmp);
});
</script>
</body>
在jQuery中跟畅，可以調(diào)用名為$.isEmptyObject的工具函數(shù)，檢測一個對象的內(nèi)容是否為空溶推，如果為空徊件，
則該函數(shù)返回true，否則悼潭，返回false值庇忌，調(diào)用格式如下：
$.isEmptyObject(obj);
其中舞箍，參數(shù)obj表示需要檢測的對象名稱舰褪。
例如，通過$.isEmptyObject()函數(shù)疏橄，檢測某個指定的對象是否為空占拍，并將結(jié)果顯示在頁面中：
<body>
<div id="divtest">
<div class="title">
<span class="fl">檢測對象是否為空</span>
</div>
<div class="content"></div>
</div>
<script type="text/javascript">
$(function () {
var obj = { };
var strTmp = "您定義了一個：";
if ($.isEmptyObject(obj)) { //檢測是否為空
strTmp += "空對象";
}
else {
strTmp += "非空對象";
}
$(".content").html(strTmp);
});
</script>
</body>
調(diào)用名為$.isPlainObject的工具函數(shù)略就，能檢測對象是否為通過{}或new Object()關(guān)鍵字創(chuàng)建的原始
對象，如果是晃酒，返回true表牢，否則，返回false值贝次，調(diào)用格式為：
$.isPlainObject (obj);
其中崔兴，參數(shù)obj表示需要檢測的對象名稱。
調(diào)用名為$.contains的工具函數(shù)蛔翅，能檢測在一個DOM節(jié)點中是否包含另外一個DOM節(jié)點敲茄，如果包含，
返回true山析，否則堰燎，返回false值，調(diào)用格式為：
$.contains (container, contained);
參數(shù)container表示一個DOM對象節(jié)點元素笋轨，用于包含其他節(jié)點的容器秆剪，contained是另一個DOM對象
節(jié)點元素，用于被其他容器所包含爵政。
調(diào)用名為$.trim的工具函數(shù)仅讽，能刪除字符串中左右兩邊的空格符，但該函數(shù)不能刪除字符串中間的空格钾挟，
調(diào)用格式為：
$.trim (str);
參數(shù)str表示需要刪除左右兩邊空格符的字符串何什。
調(diào)用名為$. param的工具函數(shù)，能使對象或數(shù)組按照key/value格式進行序列化編碼等龙，該編碼后的值
常用于向服務(wù)端發(fā)送URL請求处渣，調(diào)用格式為：
$. param (obj);
參數(shù)obj表示需要進行序列化的對象，該對象也可以是一個數(shù)組蛛砰，整個函數(shù)返回一個
經(jīng)過序列化編碼后的字符串罐栈。
調(diào)用名為$. extend的工具函數(shù)，可以對原有的工具函數(shù)進行擴展泥畅，自定義類級別的jQuery插件荠诬，
調(diào)用格式為：
$. extend ({options});
參數(shù)options表示自定義插件的函數(shù)內(nèi)容。
例如位仁，調(diào)用$.extend()函數(shù)柑贞，自定義一個用于返回兩個數(shù)中最大值的插件，并在頁面中將插件返回的
最大值顯示在頁面中：
<body>
<div id="divtest">
<div class="title">
<span class="fl">自定義工具函數(shù)求兩值中最大值</span>
<span class="fr">
<input id="btnShow" name="btnShow" type="button" value="計算" />
</span>
</div>
<div class="content">
<div class="tip"></div>
</div>
</div>
<script type="text/javascript">
/*------------------------------------------------------------/
功能：返回兩個數(shù)中最大值
參數(shù)：數(shù)字p1,p2
返回：最大值的一個數(shù)
示例：$.MaxNum(1,2);
/------------------------------------------------------------*/
(function ($) {
$.extend({
"MaxNum": function (p1, p2) {
return (p1 > p2) ? p1 : p2;
}
});
})(jQuery);
$(function () {
$("#btnShow").bind("click", function () {
$(".tip").html("");
var strTmp = "15與7中最大的數(shù)是：";
strTmp +=$.MaxNum (15, 7);
//顯示在頁面中
$(".tip").show().append(strTmp);
});
});
</script>
</body>
除使用$.extend擴展工具函數(shù)外聂抢，還可以擴展原有的Object對象钧嘶，在擴展對象時，兩個對象將進行合并琳疏，
當存在相同屬性名時有决，后者將覆蓋前者闸拿，調(diào)用格式為：
$. extend (obj1,obj2,…objN);
參數(shù)obj1至objN表示需要合并的各個原有對象。
例如书幕，調(diào)用$.extend()函數(shù)對兩個已有的對象進行合并新荤，并將合并后的新對象元素內(nèi)容顯示在頁面中：
<body>
<div id="divtest">
<div class="title">
<span class="fl">合并原有對象</span>
</div>
<div class="content">
<div class="tip"></div>
</div>
</div>
<script type="text/javascript">
$(function () {
var objInfo = { name: "" };
var objMess = { name: "白富美,", title: "歡迎與我聯(lián)系！" };
var objNewInfo =$.extend(objInfo, objMess);
var strTmp = "<b>對象 白富美 合并后</b>：<br/><br/>";
strTmp += objNewInfo.name + objInfo.title;
//顯示在頁面中
$(".tip").show().append(strTmp);
});
</script>
</body>
