jQuery?選擇器

選擇器??? ??????????????實例?????? ????????????? ??????????????選取

*?????????????????? ?????? $("*")???? ????????????? ??????????????所有元素

#id?? ???????????????????? $("#lastname")?????? ????????????? id="lastname"?的元素

.class?????? ????????????? $(".intro")????? ?????? ??????????????所有?class="intro"?的元素

element????????? ?????? $("p")???? ????????????? ??????????????所有?<p>?元素

.class.class????? ?????? $(".intro.demo")??? ??????????????所有?class="intro"?且?class="demo"?的元素

:first?????? ???????????????????? $("p:first")???? ?????? ??????????????第一個?<p>?元素

:last ???????????????????? $("p:last")????? ?????? ??????????????最后一個?<p>?元素

:even?????? ????????????? $("tr:even")??? ?????? ??????????????所有偶數(shù)?<tr>?元素

:odd?????????????? ?????? $("tr:odd")???? ?????? ??????????????所有奇數(shù)?<tr>?元素

:eq(index)?????? ?????? $("ul li:eq(3)")?????? ?????? ??????????????列表中的第四個元素（index?從?0?開始）

:gt(no)??? ????????????? $("ul li:gt(3)")?????? ?????? ??????????????列出?index?大于?3?的元素

:lt(no)???? ????????????? $("ul li:lt(3)") ?????? ??????????????列出?index?小于?3?的元素

:not(selector)? ?????? $("input:not(:empty)")?? ???????所有不為空的?input?元素

:header??? ????????????? $(":header")??? ?????? ??????????????所有標題元素?<h1> - <h6>

:animated?????? ???? ?????????????????????????????????? ??????????????所有動畫元素

:contains(text) ?????? $(":contains('W3School')")????包含指定字符串的所有元素

:empty??? ????????????? $(":empty")??? ?????? ??????????????無子（元素）節(jié)點的所有元素

:hidden??? ????????????? $("p:hidden")? ?????? ??????????????所有隱藏的?<p>?元素

:visible?????????? ?????? $("table:visible")??? ??????????????所有可見的表格

s1,s2,s3?? ????????????? $("th,td,.intro")????? ??????????????所有帶有匹配選擇的元素

[attribute]????????????? ?????? $("[href]")????? ?????? ??????????????所有帶有?href?屬性的元素

[attribute=value]??? $("[href='#']") ?????? ??????????????所有?href?屬性的值等于?"#"?的元素

[attribute!=value]?? $("[href!='#']")?????? ??????????????所有?href?屬性的值不等于?"#"?的元素

[attribute[Math Processing Error]("[href$='.jpg']")???????? ???????所有?href?屬性的值包含以?".jpg"?結尾的元素

:input????? ????????????? $(":input")????? ?????? ??????????????所有?<input>?元素

:text ???????????????????? $(":text") ????????????? ??????????????所有?type="text"?的?<input>?元素

:password?????? ?????? $(":password")?????? ??????????????所有?type="password"?的?<input>?元素

:radio????? ????????????? $(":radio")????? ?????? ??????????????所有?type="radio"?的?<input>?元素

:checkbox?????? ?????? $(":checkbox")?????? ??????????????所有?type="checkbox"?的?<input>?元素

:submit??? ????????????? $(":submit")?? ?????? ??????????????所有?type="submit"?的?<input>?元素

:reset?????? ????????????? $(":reset")????? ?????? ??????????????所有?type="reset"?的?<input>?元素

:button?????????? ?????? $(":button")??? ?????? ??????????????所有?type="button"?的?<input>?元素

:image??????????? ?????? $(":image")??? ?????? ??????????????所有?type="image"?的?<input>?元素

:file?????????????? ?????? $(":file")??????? ?????? ??????????????所有?type="file"?的?<input>?元素

:enabled? ????????????? $(":enabled")? ?????? ??????????????所有激活的?input?元素

:disabled? ????????????? $(":disabled") ?????? ??????????????所有禁用的?input?元素

:selected? ????????????? $(":selected")? ?????? ??????????????所有被選取的?input?元素

:checked? ?????? ?????? $(":checked")? ?????? ??????????????所有被選中的?input?元素

jQuery?效果函數(shù)

方法?????????????????????描述

animate()???????????????對被選元素應用“自定義”的動畫

clearQueue()??????????對被選元素移除所有排隊的函數(shù)（仍未運行的）

delay()??????????????????對被選元素的所有排隊函數(shù)（仍未運行）設置延遲

dequeue()?????????????????????運行被選元素的下一個排隊函數(shù)

fadeIn()?????????????????淡入被選元素至完全不透明

fadeOut()?????????????????????淡出被選元素至完全不透明

fadeTo()????????????????把被選元素減弱至給定的不透明度

hide()????????????????????隱藏被選的元素

queue()?????????????????顯示被選元素的排隊函數(shù)

show()??????????????????顯示被選的元素

slideDown()???????????通過調整高度來滑動顯示被選元素

slideToggle()??????????對被選元素進行滑動隱藏和滑動顯示的切換

slideUp()???????????????通過調整高度來滑動隱藏被選元素

stop()????????????????????停止在被選元素上運行動畫

toggle()?????????????????對被選元素進行隱藏和顯示的切換

jQuery?文檔操作方法

這些方法對于?XML?文檔和?HTML?文檔均是適用的，除了：html()。

方法?????? ?????????????????????描述

addClass()????????????????????向匹配的元素添加指定的類名。

after()??????????????????????????在匹配的元素之后插入內容。

append()???????????????????????向匹配的元素內部追加內容。

appendTo()???????????????????向匹配的元素內部追加內容。

attr()???????????????????????????????????設置或返回匹配元素的屬性和值。

before()????????????????????????在每個匹配的元素之前插入內容。

clone()?????????????????????????創(chuàng)建匹配元素集合的副本。

detach()????????????????????????從?DOM?中移除匹配元素集合。

empty()????????????????????????刪除匹配的元素集合中所有的子節(jié)點。

hasClass()?????????????????????檢查匹配的元素是否擁有指定的類。

html()??????????????????????????設置或返回匹配的元素集合中的?HTML?內容。

insertAfter()?????????????????把匹配的元素插入到另一個指定的元素集合的后面。

insertBefore()???????????????把匹配的元素插入到另一個指定的元素集合的前面。

prepend()????????????????????????????向每個匹配的元素內部前置內容。

prependTo()??????????????????向每個匹配的元素內部前置內容。

remove()??????????????????????移除所有匹配的元素。

removeAttr()????????????????從所有匹配的元素中移除指定的屬性。

removeClass()???????????????從所有匹配的元素中刪除全部或者指定的類。

replaceAll()??????????????????用匹配的元素替換所有匹配到的元素。

replaceWith()????????????????用新內容替換匹配的元素。

text()???????????????????????????設置或返回匹配元素的內容。

toggleClass()?????????????????從匹配的元素中添加或刪除一個類。

unwrap()??????????????????????移除并替換指定元素的父元素。

val()???????????????????????????????????設置或返回匹配元素的值。

wrap()??????????????????????????把匹配的元素用指定的內容或元素包裹起來。

wrapAll()????????????????????????????把所有匹配的元素用指定的內容或元素包裹起來。

wrapinner()??????????????????將每一個匹配的元素的子內容用指定的內容或元素包裹起來。

jQuery?屬性操作方法

下面列出的這些方法獲得或設置元素的?DOM?屬性。

這些方法對于?XML?文檔和?HTML?文檔均是適用的，除了：html()。

方法?????????????????????描述

addClass()?????????????向匹配的元素添加指定的類名。

attr()????????????????????????????設置或返回匹配元素的屬性和值。

hasClass()??????????????檢查匹配的元素是否擁有指定的類。

html()???????????????????設置或返回匹配的元素集合中的?HTML?內容。

removeAttr()?????????從所有匹配的元素中移除指定的屬性。

removeClass()????????從所有匹配的元素中刪除全部或者指定的類。

toggleClass()??????????從匹配的元素中添加或刪除一個類。

val()????????????????????????????設置或返回匹配元素的值。

jQuery CSS?操作函數(shù)

CSS?屬性?????????????描述

css()??????????????????????設置或返回匹配元素的樣式屬性。

height()?????????????????設置或返回匹配元素的高度。

offset()??????????????????返回第一個匹配元素相對于文檔的位置。

offsetParent()?????????返回最近的定位祖先元素。

position()?????????????????????返回第一個匹配元素相對于父元素的位置。

scrollLeft()????????????設置或返回匹配元素相對滾動條頂部的偏移。

scrollTop()?????????????設置或返回匹配元素相對滾動條左側的偏移。

width()??????????????????設置或返回匹配元素的寬度。

jQuery Ajax?操作函數(shù)

jQuery?庫擁有完整的?Ajax?兼容套件。其中的函數(shù)和方法允許我們在不刷新瀏覽器的情況下從服務器加載數(shù)據(jù)。

函數(shù)????????????????????????????描述

jQuery.ajax()????????????????執(zhí)行異步?HTTP (Ajax)?請求。

.ajaxComplete()????????????當?Ajax?請求完成時注冊要調用的處理程序。這是一個?Ajax?事件。

.ajaxError()??????????????????當?Ajax?請求完成且出現(xiàn)錯誤時注冊要調用的處理程序。這是一個?Ajax?事件。

.ajaxSend()???????????????????在?Ajax?請求發(fā)送之前顯示一條消息。

jQuery.ajaxSetup()????????設置將來的?Ajax?請求的默認值。

.ajaxStart()???????????????????當首個?Ajax?請求完成開始時注冊要調用的處理程序。這是一個?Ajax?事件。

.ajaxStop()???? ??????????????當所有?Ajax?請求完成時注冊要調用的處理程序。這是一個?Ajax?事件。

.ajaxSuccess()???????????????當?Ajax?請求成功完成時顯示一條消息。

jQuery.get()??????????????????使用?HTTP GET?請求從服務器加載數(shù)據(jù)。

jQuery.getJSON()?????????使用?HTTP GET?請求從服務器加載?JSON?編碼數(shù)據(jù)。

jQuery.getScript()?????????使用?HTTP GET?請求從服務器加載?JavaScript?文件，然后執(zhí)行該文件。

.load()??????????????????????????從服務器加載數(shù)據(jù)，然后把返回到?HTML?放入匹配元素。

jQuery.param()?????????????創(chuàng)建數(shù)組或對象的序列化表示，適合在?URL?查詢字符串或?Ajax?請求中使用。

jQuery.post()????????????????使用?HTTP POST?請求從服務器加載數(shù)據(jù)。

.serialize()????????????????????將表單內容序列化為字符串。

.serializeArray()????????????序列化表單元素，返回?JSON?數(shù)據(jù)結構數(shù)據(jù)。

jQuery?遍歷函數(shù)

jQuery?遍歷函數(shù)包括了用于篩選、查找和串聯(lián)元素的方法。

函數(shù)?????? ?????????????????????描述

.add()????? ?????????????????????將元素添加到匹配元素的集合中。

.andSelf()?????? ?????????????????????把堆棧中之前的元素集添加到當前集合中。

.children()????? ??????????????獲得匹配元素集合中每個元素的所有子元素。

.closest() ?????????????????????從元素本身開始，逐級向上級元素匹配，并返回最先匹配的祖先元素。

.contents()????? ??????????????獲得匹配元素集合中每個元素的子元素，包括文本和注釋節(jié)點。

.each()??? ?????????????????????對?jQuery?對象進行迭代，為每個匹配元素執(zhí)行函數(shù)。

.end()????? ?????????????????????結束當前鏈中最近的一次篩選操作，并將匹配元素集合返回到前一次的狀態(tài)。

.eq()?????? ????????????????????????????將匹配元素集合縮減為位于指定索引的新元素。

.filter()??? ?????????????????????將匹配元素集合縮減為匹配選擇器或匹配函數(shù)返回值的新元素。

.find()???? ?????????????????????獲得當前匹配元素集合中每個元素的后代，由選擇器進行篩選。

.first()???? ?????????????????????將匹配元素集合縮減為集合中的第一個元素。

.has()????? ?????????????????????將匹配元素集合縮減為包含特定元素的后代的集合。

.is() ????????????????????????????根據(jù)選擇器檢查當前匹配元素集合，如果存在至少一個匹配元素，則返回?true。

.last()????? ?????????????????????將匹配元素集合縮減為集合中的最后一個元素。

.map()???? ?????????????????????把當前匹配集合中的每個元素傳遞給函數(shù)，產生包含返回值的新?jQuery?對象。

.next()???? ?????????????????????獲得匹配元素集合中每個元素緊鄰的同輩元素。

.nextAll()???????????????????? ???????獲得匹配元素集合中每個元素之后的所有同輩元素，由選擇器進行篩選（可選）。

.nextUntil()??? ??????????????獲得每個元素之后所有的同輩元素，直到遇到匹配選擇器的元素為止。

.not()????? ?????????????????????從匹配元素集合中刪除元素。

.offsetParent() ??????????????獲得用于定位的第一個父元素。

.parent()? ?????????????????????獲得當前匹配元素集合中每個元素的父元素，由選擇器篩選（可選）。

.parents() ?????????????????????獲得當前匹配元素集合中每個元素的祖先元素，由選擇器篩選（可選）。

.parentsUntil()?????? ??????????????獲得當前匹配元素集合中每個元素的祖先元素，直到遇到匹配選擇器的元素為止。

.prev()??? ?????????????????????獲得匹配元素集合中每個元素緊鄰的前一個同輩元素，由選擇器篩選（可選）。

.prevAll()?????? ?????????????????????獲得匹配元素集合中每個元素之前的所有同輩元素，由選擇器進行篩選（可選）。

.prevUntil()??? ??????????????獲得每個元素之前所有的同輩元素，直到遇到匹配選擇器的元素為止。

.siblings()?????? ??????????????獲得匹配元素集合中所有元素的同輩元素，由選擇器篩選（可選）。

.slice()??? ?????????????????????將匹配元素集合縮減為指定范圍的子集。

?

jQuery?數(shù)據(jù)操作函數(shù)

這些方法允許我們將指定的?DOM?元素與任意數(shù)據(jù)相關聯(lián)。

函數(shù)????????????????????????????描述

.clearQueue()????????????????從隊列中刪除所有未運行的項目。

.data()??????????????????????????存儲與匹配元素相關的任意數(shù)據(jù)。

jQuery.data()????????????????存儲與指定元素相關的任意數(shù)據(jù)。

.dequeue()????????????????????從隊列最前端移除一個隊列函數(shù)，并執(zhí)行它。

jQuery.dequeue()???????????從隊列最前端移除一個隊列函數(shù)，并執(zhí)行它。

jQuery.hasData()???????????存儲與匹配元素相關的任意數(shù)據(jù)。

.queue()???????????????????????顯示或操作匹配元素所執(zhí)行函數(shù)的隊列。

jQuery.queue()??????????????顯示或操作匹配元素所執(zhí)行函數(shù)的隊列。

.removeData()???????????????移除之前存放的數(shù)據(jù)。

jQuery.removeData()?????移除之前存放的數(shù)據(jù)。

jQuery DOM?元素方法

函數(shù)????????????????????????????描述

.get()???????????????????????????從隊列中刪除所有未運行的項目。

.index()????????????????????????存儲與指定元素相關的任意數(shù)據(jù)。

.size()??????????????????????????存儲與匹配元素相關的任意數(shù)據(jù)。

.toArray()?????????????????????從隊列最前端移除一個隊列函數(shù)，并執(zhí)行它。

jQuery?核心函數(shù)

函數(shù)????????????????????????????描述

jQuery()???????????????????????接受一個字符串，其中包含了用于匹配元素集合的?CSS?選擇器。

jQuery.noConflict()??????????????運行這個函數(shù)將變量?$?的控制權讓渡給第一個實現(xiàn)它的那個庫。

jQuery?事件方法

事件方法會觸發(fā)匹配元素的事件，或將函數(shù)綁定到所有匹配元素的某個事件。

觸發(fā)實例：

$("button#demo").click()

上面的例子將觸發(fā)?id="demo"?的?button?元素的?click?事件。

綁定實例：

[Math Processing Error]("img").hide()})

上面的例子會在點擊?id="demo"?的按鈕時隱藏所有圖像。

方法????????????????????????????描述

bind()??????????????????????????向匹配元素附加一個或更多事件處理器

blur()???????????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?blur?事件

change()???????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?change?事件

click()??????????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?click?事件

dblclick()????????????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?double click?事件

delegate()????????????????????????????向匹配元素的當前或未來的子元素附加一個或多個事件處理器

die()???????????????????????????????????移除所有通過?live()?函數(shù)添加的事件處理程序。

error()??????????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?error?事件

event.isDefaultPrevented()????返回?event?對象上是否調用了?event.preventDefault()。

event.pageX??????????????????相對于文檔左邊緣的鼠標位置。

event.pageY??????????????????相對于文檔上邊緣的鼠標位置。

event.preventDefault()???阻止事件的默認動作。

event.result???????????????????包含由被指定事件觸發(fā)的事件處理器返回的最后一個值。

event.target???????????????????觸發(fā)事件的?DOM?元素。

event.timeStamp???????????該屬性返回從?1970?年?1?月?1?日到事件發(fā)生時的毫秒數(shù)。

event.type?????????????????????描述事件的類型。

event.which??????????????????指示按了哪個鍵或按鈕。

focus()?????????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?focus?事件

keydown()????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?key down?事件

keypress()?????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?key press?事件

keyup()????????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?key up?事件

live()???????????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?load?事件

load()???????????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?load?事件

mousedown()????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?mouse down?事件

mouseenter()?????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?mouse enter?事件

mouseleave()????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?mouse leave?事件

mousemove()????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?mouse move?事件

mouseout()???????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?mouse out?事件

mouseover()?????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?mouse over?事件

mouseup()????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?mouse up?事件

one()????????????????????????????向匹配元素添加事件處理器。每個元素只能觸發(fā)一次該處理器。

ready()?????????????????????????文檔就緒事件（當?HTML?文檔就緒可用時）

resize()?????????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?resize?事件

scroll()?????????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?scroll?事件

select()?????????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?select?事件

submit()???????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?submit?事件

toggle()????????????????????????綁定兩個或多個事件處理器函數(shù)，當發(fā)生輪流的?click?事件時執(zhí)行。

trigger()???????????????????????所有匹配元素的指定事件

triggerHandler()????????????第一個被匹配元素的指定事件

unbind()???????????????????????從匹配元素移除一個被添加的事件處理器

undelegate()??????????????????從匹配元素移除一個被添加的事件處理器，現(xiàn)在或將來

unload()???????????????????????觸發(fā)、或將函數(shù)綁定到指定元素的?unload?事件

總結

以上是生活随笔為你收集整理的jQuery知识汇总的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內容還不錯，歡迎將生活随笔推薦給好友。