鑒於我學過一點基礎知識，所以這裡做一些知識點歸納。
1，一個輕量級的JS庫，可以極大的簡化JS操作和代碼量。
2，語法實例：
在實際運用中可以慢慢領會。
[python]
$(this).hide()
演示jQueryhide()函數，隱藏當前的HTML元素。
$("#test").hide()
演示jQueryhide()函數，隱藏id="test"的元素。
$("p").hide()
演示jQueryhide()函數，隱藏所有<p>元素。
$(".test").hide()
演示jQueryhide()函數，隱藏所有class="test"的元素。
$("p.test").hide()-隱藏所有class="test"的段落。
$(this).hide()
演示jQueryhide()函數，隱藏當前的HTML元素。
$("#test").hide()
演示jQueryhide()函數，隱藏id="test"的元素。
$("p").hide()
演示jQueryhide()函數，隱藏所有<p>元素。
$(".test").hide()
演示jQueryhide()函數，隱藏所有class="test"的元素。
$("p.test").hide()-隱藏所有class="test"的段落。
3，語法基礎
jQuery語法是為HTML元素的選取編制的，可以對元素執行某些操作。
[python]
基礎語法是：$(selector).action()
美元符號定義jQuery
選擇符（selector）“查詢”和“查找”HTML元素
jQuery的action()執行對元素的操作
基礎語法是：$(selector).action()
美元符號定義jQuery
選擇符（selector）“查詢”和“查找”HTML元素
jQuery的action()執行對元素的操作
4，註意
所有jQuery函數位於一個documentready函數中
[python]
$(document).ready(function(){
— jQuery functions go here —-
});
$(document).ready(function(){
— jQuery functions go here —-
}); 防止網頁沒有加載完就運行，出現無法找到的標簽定義等等。
5，jQuery元素選擇器和屬性選擇器允許您通過標簽名、屬性名或內容對HTML元素進行選擇。
[python]
jQuery元素選擇器
jQuery使用CSS選擇器來選取HTML元素。
$("p")選取<p>元素。
$("p.intro")選取所有class="intro"的<p>元素。
$("p#demo")選取id="demo"的第一個<p>元素。
jQuery屬性選擇器
jQuery使用XPath表達式來選擇帶有給定屬性的元素。
$("[href]")選取所有帶有href屬性的元素。
$("[href='#']")選取所有帶有href值等於"#"的元素。
$("[href!='#']")選取所有帶有href值不等於"#"的元素。
$("[href$='.jpg']")選取所有href值以".jpg"結尾的元素。
jQueryCSS選擇器
jQueryCSS選擇器可用於改變HTML元素的CSS屬性。
jQuery元素選擇器
jQuery使用CSS選擇器來選取HTML元素。
$("p")選取<p>元素。
$("p.intro")選取所有class="intro"的<p>元素。
$("p#demo")選取id="demo"的第一個<p>元素。
jQuery屬性選擇器
jQuery使用XPath表達式來選擇帶有給定屬性的元素。
$("[href]")選取所有帶有href屬性的元素。
$("[href='#']")選取所有帶有href值等於"#"的元素。
$("[href!='#']")選取所有帶有href值不等於"#"的元素。
$("[href$='.jpg']")選取所有href值以".jpg"結尾的元素。
jQueryCSS選擇器
jQueryCSS選擇器可用於改變HTML元素的CSS屬性。
下面的例子把所有p元素的背景顏色更改為紅色：
實例:
$("p").css("background-color","red");
6,jQuery名稱沖突
jQuery使用$符號作為jQuery的簡介方式。
某些其他JavaScript庫中的函數（比如Prototype）同樣使用$符號。
jQuery使用名為noConflict()的方法來解決該問題。
varjq=jQuery.noConflict()，幫助您使用自己的名稱（比如jq）來代替$符號。
7,jQuery事件
下面是jQuery中事件方法的一些例子：
Event函數
綁定函數至
$(document).ready(function)
將函數綁定到文檔的就緒事件（當文檔完成加載時）
$(selector).click(function)
觸發或將函數綁定到被選元素的點擊事件
$(selector).dblclick(function)
觸發或將函數綁定到被選元素的雙擊事件
$(selector).focus(function)
觸發或將函數綁定到被選元素的獲得焦點事件
$(selector).mouseover(function)
觸發或將函數綁定到被選元素的鼠標懸停事件
註意點：HTML元素默認是靜態定位，且無法移動。如需使元素可以移動，請把CSS的position設置為relative或absolute。
例子：
[html]
<scripttypescripttype="text/javascript">
$(document).ready(function(){
$("#start").click(function(){
$("#box").animate({left:"100px"},"slow");
$("#box").animate({fontSize:"3em"},"slow");
});
});
</script>
<html>
<head>
<scripttypescripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
<scripttypescripttype="text/javascript">
$(document).ready(function(){
$("#start").click(function(){
$("#box").animate({left:"100px"},"slow");
$("#box").animate({fontSize:"3em"},"slow");
});
});
</script>
</head>
<body>
<h2>Thisis a heading</h2>
<pidpid="box">This is a paragraph.</p>
<p>Thisis another paragraph.</p>
<buttonidbuttonid="start">Click me</button>
<p>
<button>Click me2</button>
</p>
</body>
</html>
<scripttype="text/javascript">
$(document).ready(function(){
$("#start").click(function(){
$("#box").animate({left:"100px"},"slow");
$("#box").animate({fontSize:"3em"},"slow");
});
});
</script>
<html>
<head>
<scripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
<scripttype="text/javascript">
$(document).ready(function(){
$("#start").click(function(){
$("#box").animate({left:"100px"},"slow");
$("#box").animate({fontSize:"3em"},"slow");
});
});
</script>
</head>
<body>
<h2>Thisis a heading</h2>
<pid="box">This is a paragraph.</p>
<p>Thisis another paragraph.</p>
<buttonid="start">Click me</button>
<p>
<button>Click me2</button>
</p>
</body>
</html>
我們可以通過以上例子測試一下，發現要想移動Html元素做出效果，需要設置position屬性。
8，jQuery效果
函數
描述
$(selector).hide()
隱藏被選元素
$(selector).show()
顯示被選元素
$(selector).toggle()
切換（在隱藏與顯示之間）被選元素
$(selector).slideDown()
向下滑動（顯示）被選元素
$(selector).slideUp()
向上滑動（隱藏）被選元素
$(selector).slideToggle()
對被選元素切換向上滑動和向下滑動
$(selector).fadeIn()
淡入被選元素
$(selector).fadeOut()
淡出被選元素
$(selector).fadeTo()
把被選元素淡出為給定的不透明度
$(selector).animate()
對被選元素執行自定義動畫
本段小結：
由於jQuery是為處理HTML事件而特別設計的，那麼當您遵循以下原則時，您的代碼會更恰當且更易維護：
把所有jQuery代碼置於事件處理函數中
把所有事件處理函數置於文檔就緒事件處理器中
把jQuery代碼置於單獨的.js文件中
如果存在名稱沖突，則重命名jQuery庫
作者：altand