在實例中的所有 jQuery 函數位於一個 document ready 函數中：
$(document).ready(function(){
--- jQuery functions go here ----
});
是爲了防止文檔在完全加載（就緒）之前運行 jQuery 代碼。
如果在文檔沒有完全加載之前就運行函數，操作可能失敗。下面是兩個具體的例子：
- 試圖隱藏一個不存在的元素
- 獲得未完全加載的圖像的大小
基礎語法是：$(selector).action()
- 美元符號定義 jQuery
- 選擇符（selector）“查詢”和“查找” HTML 元素
- jQuery 的 action() 執行對元素的操作
示例
$(this).hide() - 隱藏當前元素
$("p").hide() - 隱藏所有段落
$(".test").hide() - 隱藏所有 class="test" 的所有元素
$("#test").hide() - 隱藏所有 id="test" 的元素
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" 結尾的元素。
jQuery 事件
下面是 jQuery 中事件方法的一些例子：
| Event 函數 | 綁定函數至 |
|---|---|
| $(document).ready(function) | 將函數綁定到文檔的就緒事件（當文檔完成加載時） |
| $(selector).click(function) | 觸發或將函數綁定到被選元素的點擊事件 |
| $(selector).dblclick(function) | 觸發或將函數綁定到被選元素的雙擊事件 |
| $(selector).focus(function) | 觸發或將函數綁定到被選元素的獲得焦點事件 |
| $(selector).mouseover(function) | 觸發或將函數綁定到被選元素的鼠標懸停事件 |
JavaScript的上下文Context
$(document).ready(function(){
//這裏調用this是指 window.document
});
$("div").click(function(){
//這裏調用this是指 div
});
JavaScript的Callback
回調函數是通過函數指針調用的函數，機制是把調用者和被調用者分開，調用者不用關心誰是被調用者。
<script type="text/javascript">
$(document ).ready (function () {
$("#z1").click(function () {
$("p").hide (1000,function () {
alert("The paragraph is now hidden");
});
});
});
</script>
這樣就能保證hide動畫在加載完成後才執行alert語句。這就是callback的意義。