2014年7月21日 星期一

jQuery--基礎

wrapper(包裹器):
$(selector)
或
jQuery(selector)
$("div")             選取所有<div>
$("#body")           選取 id 為 body 的元素
$("div#body")        選取 id 為 body 的<div>
$("div.contents p")  選取 class 為 contents 的<div>所包住的所有下層的<p>
$("div > div")       選取被<div>包住的下一層<div>
$("div:has(div)")    和前一個範例相反,這邊是選取至少有包住一個<div>的<div>

載入網頁後馬上執行(文件剖析完後就執行,比onLoad()快):
$(document).ready(function(){
    XXXXXXXXXX
});
或
jQuery(function(){
    XXXXXXXXXX
});

選擇器範例:
a[href^='http://']           a的連結開頭為http://的,^代表開頭
input[type='text']           輸入元素的type為text的
a[href$='.pdf']              a的連結結尾為.pdf的,$代表結尾,可快速找到pdf連結
a[href*='jquery.tw']         a的連結中有jquery.tw的,*代表無論在連結的哪個位置

//依據位置選取
:first                 網頁上第一個
:last                  網頁上最後一個
:odd                   奇數的
:even                  偶數的
:first-child           第一個子元素
:last-child            最後一個子元素
:nth-child(n)          第n個子元素(n=1即回傳第2個子元素)
:nth-child(even|ood)   回傳所有的奇數或偶數子元素
:eq(n)                 符合第n個元素
:gt(n)                 符合第n個元素之後(不包含n)的元素
:lt(n)                 符合第n個元素之前(不包含n)的元素

沒有留言:

張貼留言