選擇器
元素選擇器
("p") 選取p元素。
$("p.intro") 選取所有 class="intro" 的 p 元素。
$("p#demo") 選取所有 id="demo" 的 p 元素。
屬性選擇器
- $("[href]") 選取所有帶有 href 屬性的元素。
- $("[href='#']") 選取所有帶有 href 值等于 "#" 的元素。
- $("[href!='#']") 選取所有帶有 href 值不等于 "#" 的元素。
- $("[href='.jpg']") 選取所有 href 值以 ".jpg" 結(jié)尾的元素。
CSS選擇器
- 把所有 p 元素的背景顏色更改為紅色 $("p").css("background-color","red");
事件
當(dāng)按鈕的點(diǎn)擊事件被觸發(fā)時(shí)會(huì)調(diào)用一個(gè)函數(shù):
$("button").click(function() {..some code... } )
名稱沖突
jQuery 使用 $符號(hào)作為 jQuery 的簡(jiǎn)介方式。
某些其他 JavaScript 庫(kù)中的函數(shù)(比如 Prototype)同樣使用$ 符號(hào)。
jQuery 使用名為 noConflict() 的方法來(lái)解決該問題。
var jq=jQuery.noConflict(),幫助您使用自己的名稱(比如 jq)來(lái)代替 $ 符號(hào)。
Html
獲得(設(shè)置)
text()、html() 以及 val()
不帶參表示獲取數(shù)據(jù),帶參表示設(shè)置內(nèi)容
添加
- append() - 在被選元素的結(jié)尾插入內(nèi)容
- prepend() - 在被選元素的開頭插入內(nèi)容
- after() - 在被選元素之后插入內(nèi)容
- before() - 在被選元素之前插入內(nèi)容
刪除
- remove() - 刪除被選元素(及其子元素)
- empty() - 從被選元素中刪除子元素
獲取并設(shè)置 CSS 類
- addClass() - 向被選元素添加一個(gè)或多個(gè)類
- removeClass() - 從被選元素刪除一個(gè)或多個(gè)類
- toggleClass() - 對(duì)被選元素進(jìn)行添加/刪除類的切換操作
- css() - 設(shè)置或返回樣式屬性
尺寸
- width()
- height()
- innerWidth()
- innerHeight()
- outerWidth()
- outerHeight()
遍歷
祖先
- parent() 返回被選元素的直接父元素
- parents() 返回被選元素的所有祖先元素,它一路向上直到文檔的根元素 (<html>)。
- parentsUntil() 返回介于兩個(gè)給定元素之間的所有祖先元素。
后代
- children() 返回被選元素的所有直接子元素
- find() 返回被選元素的后代元素,一路向下直到最后一個(gè)后代。
同胞
- siblings() 返回被選元素的所有同胞元素
- next() 返回被選元素的下一個(gè)同胞元素
- nextAll() 返回被選元素的所有跟隨的同胞元素
- nextUntil() 返回介于兩個(gè)給定參數(shù)之間的所有跟隨的同胞元素
- prev()
- prevAll()
- prevUntil()
過濾
- first() 返回被選元素的首個(gè)元素
- last() 返回被選元素的最后一個(gè)元素
- eq() 返回被選元素中帶有指定索引號(hào)的元素
- filter() 不匹配這個(gè)標(biāo)準(zhǔn)的元素會(huì)被從集合中刪除,匹配的元素會(huì)被返回。
- not() 返回不匹配標(biāo)準(zhǔn)的所有元素。
Ajax
load
$(selector).load(URL,data,callback);
get
$.get(URL,callback);
post
$.post(URL,data,callback);