翻譯整理：Young.J
jQuery是一款同prototype一樣優秀js開發庫類，特别是對css和XPath的支援，使我們寫js變得更加友善！如果你不是個js高手又想寫出優 秀的js效果，jQuery可以幫你達到目的！
下載下傳完成後先加載到文檔中，然後我們來看個簡單的例子！
<script language="javascript" type="text/javascript">
$(document).ready(function(){
$("a").click(function() {
alert("Hello world!");
});
});
<script>
上邊的效果是點選文檔中所有a标簽時将彈出對話框，$("a") 是一個jQuery選擇器，$本身表示一個jQuery類，所有$()是構造一個jQuery對象，click()是這個對象的方法，同理$(document)也是一個jQuery對象，ready(fn)是$(document)的方法，表示當document全部下載下傳完畢時執行函數。
在進行下面内容之前我還要說明一點$("p")和$("#p")的差別,$("p")表示取所有p标簽(<p></p>)的元素,$("#p")表示取id為"p"(<span id="p"></span>)的元素.
我将從以下幾個内容來講解jQuery的使用:
1:核心部分
2:DOM操作
3:css操作
4:javascript處理
5:動态效果
6:event事件
7:ajax支援
8:插件程式
一：核心部分
$(expr)
說明：該函數可以通過css選擇器，Xpath或html代碼來比對目标元素，所有的jQuery操作都以此為基礎
參數：expr：字元串，一個查詢表達式或一段html字元串
例子：
未執行jQuery前：
<p>one</p>
<div>
<p>two</p>
</div>
<p>three</p>
<a href="#" id="test" onClick="jq()" >jQuery</a>
jQuery代碼及功能：
function jq(){
alert($("div > p").html());
}
運作：當點選id為test的元素時，彈出對話框文字為two，即div标簽下p元素的内容
function jq(){
$("<div><p>Hello</p></div>").appendTo("body");
運作：當點選id為test的元素時，向body中添加“<div><p>Hello</p></div>”
$(elem)
說明：限制jQuery作用于一個特定的dom元素，這個函數也接受xml文檔和windows對象
參數： elem：通過jQuery對象壓縮的DOM元素
<div>
<p>two</p>
</div><p>three</p>
<a href="#" id="test" onClick="jq()">jQuery</a>
alert($(document).find("div > p").html());
$(document.body).background("black");
運作：當點選id為test的元素時，背景色變成黑色
$(elems)
說明：限制jQuery作用于一組特定的DOM元素
參數： elem：一組通過jQuery對象壓縮的DOM元素
<form id="form1">
<input type="text" name="textfield">
<input type="submit" name="Submit" value="送出">
</form>
function jq(){
$(form1.elements ).hide();
運作：當點選id為test的元素時，隐藏form1表單中的所有元素。
$(fn)
說明：$(document).ready()的一個速記方式，當文檔全部載入時執行函數。可以有多個$(fn)當文檔載入時，同時執行所有函數！
參數：fn (Function):當文檔載入時執行的函數！
$( function(){
$(document.body).background("black");
})
運作：當文檔載入時背景變成黑色，相當于onLoad。
$(obj)
說明：複制一個jQuery對象，
參數：obj (jQuery): 要複制的jQuery對象
<p>two</p>
<p>three</p>
var f = $("div");
alert($(f).find("p").html())
運作：當點選id為test的元素時，彈出對話框文字為two，即div标簽下p元素的内容。
each(fn)
說明：将函數作用于所有比對的對象上
參數：fn (Function): 需要執行的函數
<img src="1.jpg"/>
$("img").each(function(){
this.src = "2.jpg"; });
運作：當點選id為test的元素時，img标簽的src都變成了2.jpg。
eq(pos)
說明：減少比對對象到一個單獨得dom元素
參數：pos (Number): 期望限制的索引，從0 開始
<p>This is just a test.</p>
<p>So is this</p>
alert($("p").eq(1).html())
運作：當點選id為test的元素時，alert對話框顯示：So is this，即第二個<p>标簽的内容
get() get(num)
說明：擷取比對元素，get(num)傳回比對元素中的某一個元素
參數：get (Number): 期望限制的索引，從0 開始
alert($("p").get(1).innerHTML);
注意get和eq的差別，eq傳回的是jQuery對象，get傳回的是所比對的dom對象，所有取$("p").eq(1)對象的内容用jQuery方法html()，而取$("p").get(1)的内容用innerHTML
index(obj)
說明：傳回對象索引
參數：obj (Object): 要查找的對象
<div id="test1"></div>
<div id="test2"></div>
alert($("div").index(document.getElementById('test1')));
alert($("div").index(document.getElementById('test2')));
運作：當點選id為test的元素時，兩次彈出alert對話框分别顯示0，1
size() Length
說明：目前比對對象的數量，兩者等價
<img src="test1.jpg"/>
<img src="test2.jpg"/>
alert($("img").length);
運作：當點選id為test的元素時，彈出alert對話框顯示2，表示找到兩個比對對象
二：DOM操作
屬性
我們以<img id="a" scr="5.jpg"/>為例，在原始的javascript裡面可以用var o=document.getElementById('a')取的id為a的節點對象，在用o.src來取得或修改該節點的scr屬性，在jQuery裡$("#a")将得到jQuery對象[ <img id="a" scr="5.jpg"/> ]，然後可以用jQuery提供的很多方法來進行操作，如$("#a").scr()将得到5.jpg,$("#a").scr("1.jpg")将該對象src屬性改為1,jpg。下面我們來講jQuery提供的衆多jQuery方法，友善大家快速對DOM對象進行操作
herf() herf(val)
說明：對jQuery對象屬性herf的操作。
未執行jQuery前
<a href="1.htm" id="test" onClick="jq()">jQuery</a>
alert($("#test").href());
$("#test").href("2.html");
運作：先彈出對話框顯示id為test的連接配接url，在将其url改為2.html，當彈出對話框後會看到轉向到2.html
同理，jQuery還提供類似的其他方法，大家可以分别試驗一下：
herf() herf(val) html() html(val) id() id (val) name() name (val) rel() rel (val)
src() src (val) title() title (val) val() val(val)
操作
after(html) 在比對元素後插入一段html
$("#test").after("<b>Hello</b>");
執行後相當于：
<a href="#" id="test" onClick="jq()">jQuery</a><b>Hello</b>
after(elem) after(elems) 将指定對象elem或對象組elems插入到在比對元素後
<p id="test">after</p><a href="#" onClick="jq()">jQuery</a>
jQuery代碼及功能
$("a").after($("#test"));
執行後相當于
<a href="#" onClick="jq()">jQuery</a><p id="test">after</p>
append(html)在比對元素内部，且末尾插入指定html
$("#test").append("<b>Hello</b>");
<a href="#" onClick="jq()">jQuery<b>Hello</b></a>
同理還有append(elem) append(elems) before(html) before(elem) before(elems)請執行參照append和after的方來測試、了解！
appendTo(expr) 與append(elem)相反
$("a"). appendTo ($("#test"));
<p id="test">after<a href="#" onClick="jq()">jQuery</a> </p>
clone() 複制一個jQuery對象
$("#test").clone().appendTo($("a"));
複制$("#test")然後插入到<a>後,執行後相當于
<p id="test">after</p><a href="#" onClick="jq()">jQuery</a><p id="test">after</p>
empty() 删除比對對象的所有子節點
<div id="test">
<span>span</span>
<p>after</p>
<a href="#" onClick="jq()">jQuery</a>
$("#test").empty();
<div id="test"></div><a href="#" onClick="jq()">jQuery</a>
insertAfter(expr) insertBefore(expr)
按照官方的解釋和我的幾個簡單測試insertAfter(expr)相當于before(elem),insertBefore(expr)相當于after (elem)
prepend (html) prepend (elem) prepend (elems) 在比對元素的内部且開始出插入
通過下面例子區分append(elem) appendTo(expr) prepend (elem)
<p id="a">p</p>
<div>div</div>
執行$("#a").append($("div")) 後相當于
<p id="a">
P
<div>div</div>
</p>
執行$("#a").appendTo($("div")) 後 相當于
div
<p id="a">p</p>
執行$("#a").prepend ($("div")) 後 相當于
<div>div</div>
P
remove() 删除比對對象
注意區分empty()，empty()移出比對對象的子節點，remove()，移出比對對象
wrap(htm) 将比對對象包含在給出的html代碼内
<p>Test Paragraph.</p> <a href="#" onClick="jq()">jQuery</a>
$("p").wrap("<div class='wrap'></div>");
<div class='wrap'><p>Test Paragraph.</p></div>
wrap(elem) 将比對對象包含在給出的對象内
<p>Test Paragraph.</p><div id="content"></div>
$("p").wrap( document.getElementById('content') );
<div id="content"><p>Test Paragraph.</p></div>
周遊、組合
add(expr) 在原對象的基礎上在附加符合指定表達式的jquery對象
<p>Hello</p><p><span>Hello Again</span></p>
var f=$("p").add("span");
for(var i=0;i < $(f).size();i++){
alert($(f).eq(i).html());}
執行$("p")得到比對<p>的對象，有兩個，add("span")是在("p")的基礎上加上比對<span >的對象，所有一共有3個，從上面的函數運作結果可以看到$("p").add("span")是3個對象的集合，分别是[<p>Hello</p>]，[<p><span>Hello Again</span></p>]，[<span>Hello Again</span>]。
add(el) 在比對對象的基礎上在附加指定的dom元素。
$("p").add(document.getElementById("a"));
add(els) 在比對對象的基礎上在附加指定的一組對象，els是一個數組。
var f=$("p").add([document.getElementById("a"), document.getElementById("b")])
alert($(f).eq(i).html());}
注意els是一個數組，這裡的[ ]不能漏掉。
ancestors () 一依次以比對結點的父節點的内容為對象,根節點除外（有點不好了解，看看下面例子就明白了）
<p>one</p>
<span>
<u>two</u>
</span>
var f= $("u").ancestors();
alert($(f).eq(i).html());}
第一個對象是以<u>的父節點的内容為對象，[ <u>two</u> ]
第一個對象是以<u>的父節點的父節點（div）的内容為對象，[<p>one</p><span><u>two</u></span> ]
一般一個文檔還有<body>和<html>，依次類推下去。
ancestors (expr) 在ancestors（）的基礎上之取符合表達式的對象
如上各例子講var f改為var f= $("u").ancestors(“div”),則隻傳回一個對象：
[ <p>one</p><span><u>two</u></span> ]
children() 傳回比對對象的子介點
<div id="ch">
<span>two</span>
alert($("#ch").children().html());
$("#ch").children()得到對象[ <span>two</span> ].是以.html()的結果是”two”
children(expr) 傳回比對對象的子介點中符合表達式的節點
<span>two</span>
<span id="sp">three</span>
alert($("#ch").children(“#sp”).html());
$("#ch").children()得到對象[<span>two</span><span id="sp">three</span> ].
$("#ch").children(“#sp”)過濾得到[<span id="sp">three</span> ]
parent () parent (expr)取比對對象父節點的。參照children幫助了解
contains(str) 傳回比對對象中包含字元串str的對象
<p>This is just a test.</p><p>So is this</p>
alert($("p").contains("test").html());
$("p")得到兩個對象，而包含字元串”test”隻有一個。所有$("p").contains("test")傳回 [ <p>This is just a test.</p> ]
end() 結束操作,傳回到比對元素清單上操作前的狀态.
filter(expr) filter(exprs) 過濾現實比對符合表達式的對象 exprs為數組，注意添加“[ ]”
<p>Hello</p><p>Hello Again</p><p class="selected">And Again</p>
alert($("p").filter(".selected").html())
$("p")得到三個對象，$("p").contains("test")隻傳回class為selected的對象。
find(expr) 在比對的對象中繼續查找符合表達式的對象
<p>Hello</p><p id="a">Hello Again</p><p class="selected">And Again</p>
Query代碼及功能：
alert($("p").find("#a").html())
在$("p")對象中查找id為a的對象。
is(expr) 判斷對象是否符合表達式,傳回boolen值
alert($("#a").is("p"));
在$("#a ")是否符合jquery表達式。
大家可以用$("#a").is("div"); ("#a").is("#a")多來測試一下
next() next(expr) 傳回比對對象剩餘的兄弟節點
alert($("p").next().html());
alert($("p").next(".selected").html());
$("p").next()傳回 [ <p id="a">Hello Again</p> , <p class="selected">And Again</p> ]兩個對象
$("p").next(".selected)隻傳回 [<p class="selected">And Again</p> ]一個對象
prev () prev (expr) 參照next了解
not(el) not(expr) 從jQuery對象中移出比對的對象，el為dom元素，expr為jQuery表達式。
<p>one</p><p id="a">two</p>
<a href="#" onclick="js()">jQuery</a>
function js(){
alert($("p").not(document.getElementById("a")).html());
alert($("p").not(“#a”).html());
$("p")由兩個對象，排除後的對象為[<p>one</p> ]
siblings () siblings (expr) jquery比對對象中其它兄弟級别的對象
<p id="a">two</p>
alert($("div").siblings().eq(1).html());
$("div").siblings()的結果實傳回兩個對象[<p>one</p>，<a href="#" onclick="js()">jQuery</a> ]
alert($("div").siblings(“a”)傳回一個對象[<a href="#" onclick="js()">jQuery</a> ]
其他
addClass(class) 為比對對象添加一個class樣式
removeClass (class) 将第一個比對對象的某個class樣式移出
attr (name) 擷取第一個比對對象的屬性
<img src="test.jpg"/><a href="#" onclick="js()">jQuery</a>
alert($("img").attr("src"));
傳回test.jpg
attr (prop) 為第一個比對對象的設定屬性，prop為hash對象，用于為某對象批量添加衆多屬性
<img/><a href="#" onclick="js()">jQuery</a>
$("img").attr({ src: "test.jpg", alt: "Test Image" });
運作結果相當于<img src="test.jpg" alt="Test Image"/>
attr (key,value) 為第一個比對對象的設定屬性，key為屬性名，value為屬性值
$("img").attr(“src”,”test.jpg”);
運作結果相當于<img src="test.jpg"/>
removeAttr (name) 将第一個比對對象的某個屬性移出
<img alt="test"/><a href="#" onclick="js()">jQuery</a>
$("img"). removeAttr("alt");
運作結果相當于<img />
toggleClass (class) 将目前對象添加一個樣式，不是目前對象則移出此樣式，傳回的是處理後的對象
<p>Hello</p><p class="selected">Hello Again</p><a href="#" onclick="js()">jQuery</a>
$("p")的結果是傳回對象 [<p>Hello</p>,<p class="selected">Hello Again</p> ]
$("p").toggleClass("selected")的結果是實傳回對象 [ <p class="selected">Hello</p>, <p>Hello Again</p> ]
三：CSS操作
傳統javascript對css的操作相當繁瑣，比如<div id="a" style="background:blue">css</div>取它的background文法是 document.getElementById("a").style.background，而jQuery對css更友善的操作，$("#a").background()，$("#a").background(“red”)
$("#a")得到jQuery對象[ <div id="a" … /div> ]
$("#a").background()将取出該對象的background樣式。
$("#a").background(“red”)将該對象的background樣式設為redjQuery提供了以下方法，來操作css
background () background (val) color() color(val) css(name) css(prop)
css(key, value) float() float(val) height() height(val) width() width(val)
left() left(val) overflow() overflow(val) position() position(val) top() top(val)
這裡需要講解一下css(name) css(prop) css(key, value)，其他的看名字都知道什麼作用了！
<div id="a" style="background:blue; color:red">css</div><P id="b">test</P>
css(name) 擷取樣式名為name的樣式
$("#a").css("color") 将得到樣式中color值red，("#a").css("background ")将得到blue
css(prop) prop是一個hash對象，用于設定大量的css樣式
$("#b").css({ color: "red", background: "blue" });
最終效果是<p id="b" style="background:blue; color:red">test</p>,{ color: "red", background: "blue" }，hash對象，color為key，"red"為value，
css(key, value) 用于設定一個單獨得css樣式
$("#b").css("color","red");最終效果是<p id="b" style="color:red">test</p>
四：JavaScript處理
$.browser() 判斷浏覽器類型，傳回boolen值
$(function(){
if($.browser.msie) {
alert("這是一個IE浏覽器");}
else if($.browser.opera) {
alert("這是一個opera浏覽器");}
當頁面載入式判斷浏覽器類型，可判斷的類型有msie、mozilla、opera、safari
$.each(obj, fn) obj為對象或數組，fn為在obj上依次執行的函數，注意區分$().each()
$.each( [0,1,2], function(i){ alert( "Item #" + i + ": " + this ); });
分别将0，1，2為參數，傳入到function(i)中
$.each({ name: "John", lang: "JS" }, function(i){ alert( "Name: " + i + ", Value: " + this );
{ name: "John", lang: "JS" }為一個hash對象，依次将hash中每組對象傳入到函數中
$.extend(obj, prop) 用第二個對象擴充第一個對象
var settings = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
$.extend(settings, options);
執行後settings對象為{ validate: true, limit: 5, name: "bar" }
可以用下面函數來測試
var settings = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
$.extend(settings, options);
$.each(settings, function(i){ alert( i + "=" + this ); });
$.grep(array,fn) 通過函數fn來過濾array，将array中的元素依次傳給fn，fn必須傳回一個boolen，如fn傳回true，将被過濾
var arr= $.grep( [0,1,2,3,4], function(i){ return i > 2; });
$.each(arr, function(i){ alert(i); });
我們可以看待執行$.grep後數組[0,1,2,3,4]變成[0，1]
$.merge(first, second) 兩個參數都是數組，排出第二個數組中與第一個相同的，再将兩個數組合并
$(function(){
var arr = $.merge( [0,1,2], [2,3,4] )
$.each(arr, function(i){ alert(i); });
可以看出arr的結果為[0,1,2,3,4]
$.trim(str) 移出字元串兩端的空格
$.trim(" hello, how are you? ")的結果是"hello, how are you?"
五：動态效果
在将這部分之前我們先看個例子，相信做網頁的朋友都遇到n級菜單的情景，但點選某菜單按鈕時，如果它的子菜單是顯示的，則隐藏子菜單，如果子菜單隐藏，則顯示出來，傳統的javascript做法是先用getElementById取出子菜單所在容器的id，在判斷該容器的style.display是否等于none，如果等于則設為block,如果不等于這設為none，如果在将效果設定複雜一點，當點選按鈕時，不是忽然隐藏和顯示子菜單，而是高度平滑的轉變，這時就要通過setTimeout來設定子菜單的height了，再複雜一點透明度也平滑的消失和顯現，這時顯現下來需要編寫很多代碼，如果js基礎不好的朋友可能隻能從别人寫好的代碼拿過來修改了！jQuery實作上面效果隻需要1句話就行，$("#a").toggle("slow"),
,學完jQuery後還需要抄襲修改别人的代碼嗎？下面我們逐個介紹jQuery用于效果處理的方法。
hide() 隐藏比對對象
<p id="a">Hello Again</p><a href="#" onClick=’ ("#a").hide()’>jQuery</a>
當點選連接配接時,id為a的對象的display變為none。
show() 顯示比對對象
hide(speed) 以一定的速度隐藏比對對象，其大小（長寬）和透明度都逐漸變化到0，speed有3級("slow", "normal", "fast")，也可以是自定義的速度。
show(speed) 以一定的速度顯示比對對象，其大小（長寬）和透明度都由0逐漸變化到正常
hide(speed, callback) show(speed, callback) 當顯示和隐藏變化結束後執行函數callback
toggle() toggle(speed) 如果目前比對對象隐藏，則顯示他們，如果目前是顯示的，就隐藏，toggle(speed),其大小（長寬）和透明度都随之逐漸變化。
<img src="1.jpg" style="width:150px"/>
<a href="#" onClick='$("img").toggle("slow")'>jQuery</a>
fadeIn(speeds) fadeOut(speeds) 根據速度調整透明度來顯示或隐藏比對對象，注意有别于hide(speed)和show(speed)，fadeIn和fadeOut都隻調整透明度，不調整大小
<img src="1.jpg" style="display:none"/><a href="#" onClick='$("img ").fadeIn("slow")'> jQuery </a>
點選連接配接後可以看到圖檔逐漸顯示。
fadeIn(speed, callback) fadeOut(speed, callback) callback為函數，先通過調整透明度來顯示或隐藏比對對象，當調整結束後執行callback函數
<a href="#" onClick='$("img ").fadeIn("slow",function(){ alert("Animation Done."); })'> jQuery </a>
點選連接配接後可以看到圖檔逐漸顯示,顯示完全後彈出對話框
fadeTo(speed, opacity, callback) 将比對對象以speed速度調整倒透明度opacity，然後執行函數callback。Opacity為最終顯示的透明度(0-1).
<img src="1.jpg"/><br>
<a href="#" onClick='$("img ").fadeTo("slow",0.55,function(){ alert("Animation Done."); })'> jQuery </a>
大家可以看一下自己看看效果，如果不用jQuery，編寫原始javascript腳本可能很多代碼！
slideDown(speeds) 将比對對象的高度由0以指定速率平滑的變化到正常！
<img src="1.jpg" style="display:none"/>
<a href="#" onClick='$("img ").slideDown("slow")'>jQuery</a>
slideDown(speeds,callback) 将比對對象的高度由0變化到正常！變化結束後執行函數callback
slideUp("slow") slideUp(speed, callback) 比對對象的高度由正常變化到0
slideToggle("slow") 如果比對對象的高度正常則逐漸變化到0，若為0，則逐漸變化到正常
六：事件處理
hover(Function, Function) 當滑鼠move over時觸發第一個function，當滑鼠move out時觸發第二個function
樣式：<style>.red{color:#FF0000}</style>
Html代碼： <div id="a">sdf</div>
jQuery代碼及效果
$("#a").hover(function(){$(this).addClass("red");},
function(){ $(this).removeClass("red");
});
最終效果是當滑鼠移到id為a的層上時圖層增加一個red樣式，離開層時移出red樣式
toggle(Function, Function) 當比對元素第一次被點選時觸發第一個函數，當第二次被點選時觸發第二個函數
$("#a"). toggle (function(){$(this).addClass("red");},
function(){ $(this).removeClass("red");
});
最終效果是當滑鼠點選id為a的層上時圖層增加一個red樣式，離開層時移出red樣式
bind(type, fn) 使用者将一個事件和觸發事件的方式綁定到比對對象上。
trigger(type) 使用者觸發type形式的事件。$("p").trigger("click")
還有：unbind() unbind(type) unbind(type, fn)
Dynamic event(Function) 綁定和取消綁定提供函數的簡捷方式
例：
$("#a").bind("click",function() {
$(this).addClass("red");
也可以這樣寫：
$("#a").click(function() {
$(this).addClass("red");
最終效果是當滑鼠點選id為a的層上時圖層增加一個red樣式，
jQuery提供的函數
用于browers事件
error(fn) load(fn) unload(fn) resize(fn) scroll(fn)
用于form事件
change(fn) select(fn) submit(fn)
用于keyboard事件
keydown(fn) keypress(fn) keyup(fn)
用于mouse事件
click(fn) dblclick(fn) mousedown(fn) mousemove(fn)
mouseout(fn) mouseover(fn) mouseup(fn)
用于UI事件
blur(fn) focus(fn)
以上事件的擴充再擴充為5類
舉例，click(fn) 擴充 click() unclick() oneclick(fn) unclick(fn)
click(fn)：增加一個點選時觸發某函數的事件
click()：可以在其他事件中執行比對對象的click事件。
unclick ()：不執行比對對象的click事件。
oneclick(fn)：隻增加可以執行一次的click事件。
unclick (fn)：增加一個點選時不觸發某函數的事件。
上面列舉的用于browers、form、keyboard、mouse、UI的事件都可以按以上方法擴充。
七：Ajax支援
通用方式：
$.ajax(prop) 通過一個ajax請求，回去遠端資料，prop是一個hash表，它可以傳遞的key/value有以下幾種。
(String)type：資料傳遞方式(get或post)。
((String)url：資料請求頁面的url
((String)data：傳遞資料的參數字元串，隻适合post方式
((String)dataType：期待資料傳回的資料格式(例如 "xml", "html", "script",或 "json")
((Boolean)ifModified： 當最後一次請求的相應有變化是才成功傳回，預設值是false
((Number)timeout:設定時間延遲請求的時間。可以參考$.ajaxTimeout
((Boolean)global：是否為目前請求觸發ajax全局事件，預設為true
((Function)error：當請求失敗時觸發的函數。
((Function)success：當請求成功時觸發函數
((Function)complete：當請求完成後出發函數
jQuery代碼及說明
$.ajax({url: "ajax.htm",
success:function(msg){
$(div"#a").html(msg);
}
});
将ajax.htm傳回的内容作為id為a的div内容
$.ajax({ url: "ajax.aspx",
type:"get",
dataType:"html",
data: "name=John&location=Boston",
success:function(msg){
$("#a").html(msg);
}
});
用get方式向ajax.aspx頁面傳參數，并将傳回内容負給id為a的對象。
$.ajaxTimeout(time) 設定請求結束時間
$.ajaxTimeout( 5000 )
其它簡化方式：
$.get(url, params, callback) 用get方式向遠端頁面傳遞參數，請求完成後處理函數，除了url外，其它參數任意選擇！
$.get( "ajax.htm" , function(data){ $("#a").html(data) })
$.get( "ajax.asp",
{ name: "young", age: "25" },
function(data){ alert("Data Loaded: " + data); }
)
$.getIfModified(url, params, callback) 用get方式向遠端頁面傳遞參數，從最後一次請求後如果資料有變化才作出響應，執行函數callback
$.getJSON(url, params, callback) 用get方式向遠端json對象傳遞參數，請求完成後處理函數callback。
$.getScript(url, callback) 用get方式載入并運作一個遠端javascript檔案。請求完成後處理函數callback。
$.post(url, params, callback) 用post方式向遠端頁面傳遞參數，請求完成後處理函數callback
load(url, params, callback) 載入一個遠端檔案并載入頁面DOM中，并執行函數callback
$("#a").load("ajax.htm", function() { alert("load is done"); } );
向ajax.htm頁面送出請求，将傳回結果裝入id為a的内容中，然後再執行函數callback。
loadIfModified(url, params, callback) 用get方式向遠端頁面傳遞參數，從最後一次請求後如果資料有變化才作出響應，将傳回結果載入頁面DOM中，并執行函數callback
ajaxStart(callback) 當ajax請求發生錯誤是時執行函數callback
ajaxComplete(callback) 當ajax請求完成時執行函數callback
ajaxError(callback) 當ajax請求發生錯誤時執行函數callback
ajaxStop(callback) 當ajax請求停止時執行函數callback
ajaxSuccess(callback) 當ajax請求成功時執行函數callback
八：jQuery插件
随着jQuery的廣泛使用，已經出現了大量jQuery插件，如thickbox，iFX，jQuery-googleMap等，簡單的引用這些源檔案就可以友善的使用這些插件。這裡我簡單的介紹一些網址供大家參考，這些網站頭提供了大量的demo，并且使用及其簡單，及時E文不好，也能快速掌握！
還有其它很多插件，大家可以google以下，如果大家發現好的了，可以留言共享以下！
——————————————————————————————————————————————
本文轉自永春部落格園部落格，原文連結：http://www.cnblogs.com/firstyi/archive/2007/11/06/951020.html，如需轉載請自行聯系原作者