前言：
jQuery是一個不錯的javascript產品，我曾經想總結一些javascript的一些常用功能，以備自己調用，然而看了jQuery，發現他做的太強了，不得不向他學習。“永遠學習強者”，但是也告誡自己，不要被它們綁住了雙手，否則你的創造性就會被扼殺，我建議當工具使用，不必死計其語法，否則自己就“暈”了。我希望有更多有創造性的產品出現。
獲取jQuery最新版本：http://jquery.com/src/
一、基本操作：
1、當文檔（dom）加載完畢后，立即執行內容：
$(document).ready(function() ...{
// do stuff when DOM is ready
});
2、為所有的A標記添加一個事件。 ：）當然也可以是其它的，任意發揮吧。
$("a").click(function() ...{
alert("Hello world!");
});
3、使用選擇器與事件
jQuery中提供了兩種方法來選擇HTML元素，第一種是用CSS和Xpath選擇器聯合起來形成一個字符串來傳送到jQuery的構造器（如：$("div > ul a")）；第二種是用jQuery對象的幾個methods(方法)。這兩種方式還可以聯合起來混合使用。
//在一個菜單應用中，將其子菜單中的A標記加樣式
$(document).ready(function() ...{
$("#Menu ul a").hover(function()...{
$(this).addClass("blue");
},function()...{
$(this).removeClass("blue");
});
注：id選擇加#號前綴，其下級標記用空格隔開。：）是不是很容易啊
hover為其事件，其它事件有click,mouseover,mouseout,change...等。可參考:http://visualjquery.com
4、用這些選擇器和事件你已經可以做很多的事情了，但這里有一個更強的好東東！
$(document).ready(function() ...{
$("#orderedlist").find("li").each(function(i) ...{
$(this).html( $(this).html() + " BAM! " + i );
});
});
注：find() 讓你在已經選擇的element中作條件查找,因此 $("#orderedlist).find("li") 就像 $("#orderedlist li")一樣。each()方法迭代了所有的li，并可以在此基礎上作更多的處理。 大部分的方法,如addClass(), 都可以用它們自己的 each() 。在這個例子中, html()用來獲取每個li的html文本, 追加一些文字，并將之設置為li的html文本。
5、不希望某些特定的元素被選擇。jQuery 提供了filter() 和not() 方法來解決這個問題
$(document).ready(function() ...{
$("li").not("[ul]").css("border", "1px solid black");
});
注：這個代碼選擇了所有的li元素，然后去除了沒有ul子元素的li元素。注意體會方便之極的css()方法，并再次提醒請務必實際測試觀察效果，比方說換個CSS樣式呢？再加一個CSS樣式呢？像這樣：$("li").not("[ul]").css("border", "1px solid black").css("color","red")。
6、可以在子元素和屬性(elements and attributes)上用作過濾器，比如你可能想選擇所有的帶有name屬性的鏈接:
$(document).ready(function() ...{
$("a[@name]").background("#eee");
});
注：這個代碼給所有帶有name屬性的鏈接加了一個背景色。
6.1常見的情況是以name來選擇鏈接，你可能需要選擇一個有特點href屬性的鏈接，這在不同的瀏覽器下對href的理解可能會不一致，所以我們的部分匹配("*=")的方式來代替完全匹配("=")：
$(document).ready(function() ...{
$("a[@href*=/content/gallery]").click(function() ...{
// do something with all links that point somewhere to /content/gallery
});
});
小示例，比如一個FAQ的頁面，答案首先會隱藏，當問題點擊時，答案顯示出來，jQuery代碼如下：
$(document).ready(function() ...{
$('#faq').find('dd').hide().end().find('dt').click(function() ...{
var answer = $(this).next();
if (answer.is(':visible')) ...{
answer.slideUp();
} else ...{
answer.slideDown();
}
});
});
注：在點擊事件中的，我們用 $(this).next() 來找到dt下面緊接的一個dd元素，這讓我們可以快速地選擇在被點擊問題下面的答案。
7、除了選擇同級別的元素外，你也可以選擇父級的元素。可能你想在用戶鼠標移到文章某段的某個鏈接時，它的父級元素--也就是文章的這一段突出顯示，試試這個：
$(document).ready(function() ...{
$("a").hover(function() ...{
$(this).parents("p").addClass("highlight");
}, function() ...{
$(this).parents("p").removeClass("highlight");
});
});
8、在我們繼續之前我們先來看看這一步： jQuery會讓代碼變得更短從而更容易理解和維護，下面是
$(document).ready(callback)的縮寫法：
$(function() ...{
// code to execute when the DOM is ready
});
應用到我們的Hello world例子中，可以這樣:
$(function() ...{
$("a").click(function() ...{
alert("Hello world!");
});
});
：）是不是很容易呀，多虧了jQuery團隊的努力呀！