jquery初學筆記

$(document).ready(function(){
    --- jQuery functions go here ----
    });

實例中jQuery 函數位於一個 document ready 函數中：

這是爲了防止文檔在徹底加載（就緒）以前運行 jQuery 代碼。

若是在文檔沒有徹底加載以前就運行函數，操做可能失敗。下面是兩個具體的例子：

• 試圖隱藏一個不存在的元素

• 得到未徹底加載的圖像的大小

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 CSS 選擇器

jQuery CSS 選擇器可用於改變 HTML 元素的 CSS 屬性。

下面的例子把全部 p 元素的背景顏色更改成紅色：

實例

$("p").css("background-color","red");

語法	描述
$(this)	當前 HTML 元素
$("p")	全部<p>元素
$("p.b")	全部class="b"的<p>元素
$(".b")	全部class="b"的元素
$("#b")	全部id="b"的元素
$("div#intro .head")	id="intro" 的 <div> 元素中的全部 class="head" 的元素

jQuery 事件

Event 函數                                                        綁定函數至                                                           

$(document).ready(function)                        將函數綁定到文檔的就緒事件（當文檔完成加載時）

$(selector).click(function)                             觸發或將函數綁定到被選元素的點擊事件                

$(selector).dblclick(function)                        觸發或將函數綁定到被選元素的雙擊事件                

$(selector).focus(function)                            觸發或將函數綁定到被選元素的得到焦點事件         

$(selector).mouseover(function)                  觸發或將函數綁定到被選元素的鼠標懸停事件