當前位置:編程學習大全網 - 源碼下載 - jquery中有哪些api實例分享

jquery中有哪些api實例分享

本文主要給讀者們分享了壹些主要的jQuery API,其中包括jQuery 核心函數和方法、jQuery屬性參考手冊、jQuery CSS操作、jQuery選擇器、jQuery文檔操作、jQuery篩選操作、jQuery事件方法、jQuery效果、jQuery Ajax操作、jQuery工具函數、jQuery事件對象、jQuery延遲對象、jQuery回調函數,歡迎收藏使用。

jquery核心函數

函數 描述

jQuery() 這個函數接收壹個包含 CSS 選擇器的字符串,然後用這個字符串去匹配壹組元素。

jQuery()1.8* 根據提供的原始 HTML 標記字符串,動態創建由 jQuery 對象包裝的 DOM 元素。同時設置壹系列的屬性、事件等。

jQuery() $(document).ready()的簡寫。

jQuery.holdReady()1.6+ 暫停或恢復.ready() 事件的執行。

each() 以每壹個匹配的元素作為上下文來執行壹個函數。

size() jQuery 對象中元素的個數。

length jQuery 對象中元素的個數。

selector 返回傳給jQuery()的原始選擇器。

context 返回傳給jQuery()的原始的DOM節點內容,即jQuery()的第二個參數。如果沒有指定,那麽context指向當前的文檔(document)。

get() 取得其中壹個匹配的元素。 num表示取得第幾個匹配的元素。

index() 搜索匹配的元素,並返回相應元素的索引值,從0開始計數。

data() 在元素上存放數據,返回jQuery對象。

removeData()1.7* 在元素上移除存放的數據

queue() 顯示或操作在匹配元素上執行的函數隊列

dequeue() 從隊列最前端移除壹個隊列函數,並執行他。

clearQueue() 清空對象上尚未執行的所有隊列

jQuery.fn.extend() 擴展 jQuery 元素集來提供新的方法(通常用來制作插件)。

jQuery.extend() 擴展jQuery對象本身。

jQuery.noConflict() 運行這個函數將變量$的控制權讓渡給第壹個實現它的那個庫。jQuery屬性

函數 描述

attr() 設置或返回被選元素的屬性值。

removeAttr() 從每壹個匹配的元素中刪除壹個屬性

prop()1.6+ 獲取在匹配的元素集中的第壹個元素的屬性值。

removeProp()1.6+ 用來刪除由.prop()方法設置的屬性集

addClass() 為每個匹配的元素添加指定的類名。

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

toggleClass() 如果存在(不存在)就刪除(添加)壹個類。

html() 取得第壹個匹配元素的html內容。這個函數不能用於XML文檔。但可以用於XHTML文檔。

text() 取得所有匹配元素的內容。

val() 獲得匹配元素的當前值。jQuery CSS操作

下面列出的這些方法設置或返回元素的 CSS 相關屬性。

函數 描述

css()1.9* 訪問匹配元素的樣式屬性。

jQuery.cssHooks 直接向 jQuery 中添加鉤子,用於覆蓋設置或獲取特定 CSS 屬性時的方法,目的是為了標準化 CSS 屬性名或創建自定義屬性。

offset() 獲取匹配元素在當前視口的相對偏移。

position() 獲取匹配元素相對父元素的偏移。

scrollTop() 獲取匹配元素相對滾動條頂部的偏移。

scrollLeft() 獲取匹配元素相對滾動條左側的偏移。

heigh() 取得匹配元素當前計算的高度值(px)。

width() 取得第壹個匹配元素當前計算的寬度值(px)。

innerHeight() 獲取第壹個匹配元素內部區域高度(包括內邊距、不包括邊框)。

innerWidth() 獲取第壹個匹配元素內部區域寬度(包括內邊距、不包括邊框)。

outerHeight() 獲取第壹個匹配元素外部高度(默認包括內邊距和邊框)。

outerWidth() 獲取第壹個匹配元素外部寬度(默認包括內邊距和邊框)。jQuery選擇器

函數 描述

#id

element

.class

*

selector1,selector2,selectorN

ancestor descendant

parent > child

prev + next

prev ~ siblings

:first

:not()

:even

:odd

:eq()

:gt()

:lang1.9+

:last

:lt()

:header

:animated

:focus1.6+

:root1.9+

:target1.9+

:contains()

:empty

:has()

:parent

:hidden

:visible

[attribute]

[attribute=value]

[attribute!=value]

[attribute^=value]

[attribute$=value]

[attribute*=value]

[attrSel1][attrSel2][attrSelN]

:first-child

:first-of-type1.9+

:last-child

:last-of-type1.9+

:nth-child

:nth-last-child()1.9+

:nth-last-of-type()1.9+

:nth-of-type()1.9+

:only-child

:only-of-type1.9+

:input

:text

:password

:radio

:checkbox

:submit

:image

:reset

:button

:file

:hidden

:enabled

:disabled

:checked

:selectedjQuery文檔操作

函數 描述

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

appendTo() 把所有匹配的元素追加到另壹個指定的元素元素集合中。

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

prependTo() 把所有匹配的元素前置到另壹個、指定的元素元素集合中。

after() 在每個匹配的元素之後插入內容。

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

insertAfter() 把所有匹配的元素插入到另壹個、指定的元素元素集合的後面。

insertBefore() 把所有匹配的元素插入到另壹個、指定的元素元素集合的前面。

wrap() 把所有匹配的元素用其他元素的結構化標記包裹起來。

unwrap() 這個方法將移出元素的父元素。

wrapall() 將所有匹配的元素用單個元素包裹起來

wrapInner() 將每壹個匹配的元素的子內容(包括文本節點)用壹個HTML結構包裹起來

replaceWith() 將所有匹配的元素替換成指定的HTML或DOM元素。

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

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

remove() 從DOM中刪除所有匹配的元素。

detach() 從DOM中刪除所有匹配的元素。

clone() 克隆匹配的DOM元素並且選中這些克隆的副本。jQuery篩選操作

函數 描述

eq() 獲取第N個元素

first() 獲取第壹個元素

last() 獲取最後壹個元素

hasClass() 檢查當前的元素是否含有某個特定的類,如果有,則返回true。

filter() 篩選出與指定表達式匹配的元素集合。

is()1.6* 根據選擇器、DOM元素或 jQuery 對象來檢測匹配元素集合,如果其中至少有壹個元素符合這個給定的表達式就返回true。

map() 將壹組元素轉換成其他數組(不論是否是元素數組)

has() 保留包含特定後代的元素,去掉那些不含有指定後代的元素。

not() 刪除與指定表達式匹配的元素

slice() 選取壹個匹配的子集

children() 取得壹個包含匹配的元素集合中每壹個元素的所有子元素的元素集合。

closest()1.7* 從元素本身開始,逐級向上級元素匹配,並返回最先匹配的元素。

find()1.6* 搜索所有與指定表達式匹配的元素。這個函數是找出正在處理的元素的後代元素的好方法。

next() 取得壹個包含匹配的元素集合中每壹個元素緊鄰的後面同輩元素的元素集合。

nextall() 查找當前元素之後所有的同輩元素。

nextUntil()1.6* 查找當前元素之後所有的同輩元素,直到遇到匹配的那個元素為止。

offsetParent() 返回第壹個匹配元素用於定位的父節點。

parent() 取得壹個包含著所有匹配元素的唯壹父元素的元素集合。

parents() 取得壹個包含著所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通過壹個可選的表達式進行篩選。

parentsUntil()1.6* 查找當前元素的所有的父輩元素,直到遇到匹配的那個元素為止。

prev() 取得壹個包含匹配的元素集合中每壹個元素緊鄰的前壹個同輩元素的元素集合。

prevall() 查找當前元素之前所有的同輩元素

prevUntil()1.6* 查找當前元素之前所有的同輩元素,直到遇到匹配的那個元素為止。

siblings() 取得壹個包含匹配的元素集合中每壹個元素的所有唯壹同輩元素的元素集合。可以用可選的表達式進行篩選。

add() 把與表達式匹配的元素添加到jQuery對象中。這個函數可以用於連接分別與兩個表達式匹配的元素結果集。

andSelf() 加入先前所選的加入當前元素中

contents() 查找匹配元素內部所有的子節點(包括文本節點)。如果元素是壹個iframe,則查找文檔內容

end() 回到最近的壹個"破壞性"操作之前。即,將匹配的元素列表變為前壹次的狀態。jQuery篩選操作

函數 描述

eq() 獲取第N個元素

first() 獲取第壹個元素

last() 獲取最後壹個元素

hasClass() 檢查當前的元素是否含有某個特定的類,如果有,則返回true。

filter() 篩選出與指定表達式匹配的元素集合。

is()1.6* 根據選擇器、DOM元素或 jQuery 對象來檢測匹配元素集合,如果其中至少有壹個元素符合這個給定的表達式就返回true。

map() 將壹組元素轉換成其他數組(不論是否是元素數組)

has() 保留包含特定後代的元素,去掉那些不含有指定後代的元素。

not() 刪除與指定表達式匹配的元素

slice() 選取壹個匹配的子集

children() 取得壹個包含匹配的元素集合中每壹個元素的所有子元素的元素集合。

closest()1.7* 從元素本身開始,逐級向上級元素匹配,並返回最先匹配的元素。

find()1.6* 搜索所有與指定表達式匹配的元素。這個函數是找出正在處理的元素的後代元素的好方法。

next() 取得壹個包含匹配的元素集合中每壹個元素緊鄰的後面同輩元素的元素集合。

nextall() 查找當前元素之後所有的同輩元素。

nextUntil()1.6* 查找當前元素之後所有的同輩元素,直到遇到匹配的那個元素為止。

offsetParent() 返回第壹個匹配元素用於定位的父節點。

parent() 取得壹個包含著所有匹配元素的唯壹父元素的元素集合。

parents() 取得壹個包含著所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通過壹個可選的表達式進行篩選。

parentsUntil()1.6* 查找當前元素的所有的父輩元素,直到遇到匹配的那個元素為止。

prev() 取得壹個包含匹配的元素集合中每壹個元素緊鄰的前壹個同輩元素的元素集合。

prevall() 查找當前元素之前所有的同輩元素

prevUntil()1.6* 查找當前元素之前所有的同輩元素,直到遇到匹配的那個元素為止。

siblings() 取得壹個包含匹配的元素集合中每壹個元素的所有唯壹同輩元素的元素集合。可以用可選的表達式進行篩選。

add() 把與表達式匹配的元素添加到jQuery對象中。這個函數可以用於連接分別與兩個表達式匹配的元素結果集。

andSelf() 加入先前所選的加入當前元素中

contents() 查找匹配元素內部所有的子節點(包括文本節點)。如果元素是壹個iframe,則查找文檔內容

end() 回到最近的壹個"破壞性"操作之前。即,將匹配的元素列表變為前壹次的狀態。jQuery事件方法

函數 描述

ready() 當DOM載入就緒可以查詢及操縱時綁定壹個要執行的函數。

on()1.7+ 在選擇元素上綁定壹個或多個事件的事件處理函數。

off()1.7+ 在選擇元素上移除壹個或多個事件的事件處理函數。

bind() 為每個匹配元素的特定事件綁定事件處理函數。

one() 為每壹個匹配元素的特定事件(像click)綁定壹個壹次性的事件處理函數。

trigger() 在每壹個匹配的元素上觸發某類事件。

triggerHandler() 這個特別的方法將會觸發指定的事件類型上所有綁定的處理函數。但不會執行瀏覽器默認動作,也不會產生事件冒泡。

unbind() bind()的反向操作,從每壹個匹配的元素中刪除綁定的事件。

live()1.7- jQuery 給所有匹配的元素附加壹個事件處理函數,即使這個元素是以後再添加進來的也有效。

die()1.7- 從元素中刪除先前用.live()綁定的所有事件.(此方法與live正好完全相反。)

delegate() 指定的元素(屬於被選元素的子元素)添加壹個或多個事件處理程序,並規定當這些事件發生時運行的函數。

undelegate()1.6* 刪除由 delegate() 方法添加的壹個或多個事件處理程序。

hover() 壹個模仿懸停事件(鼠標移動到壹個對象上面及移出這個對象)的方法。

toggle() 用於綁定兩個或多個事件處理器函數,以響應被選元素的輪流的 click 事件。

blur() 當元素失去焦點時觸發 blur 事件。

change() 當元素的值發生改變時,會發生 change 事件。

click() 觸發每壹個匹配元素的click事件。

dblclick() 當雙擊元素時,會發生 dblclick 事件。

error() 當元素遇到錯誤(沒有正確載入)時,發生 error 事件。

focus() 當元素獲得焦點時,觸發 focus 事件。

focusin() 當元素獲得焦點時,觸發 focusin 事件。

focusout() 當元素失去焦點時觸發 focusout 事件。

keydown() 當鍵盤或按鈕被按下時,發生 keydown 事件。

keypress() 當鍵盤或按鈕被按下時,發生 keypress 事件。

keyup() 當按鈕被松開時,發生 keyup 事件。它發生在當前獲得焦點的元素上。

mousedown() 當鼠標指針移動到元素上方,並按下鼠標按鍵時,會發生 mousedown 事件。

mouseenter() 當鼠標指針穿過元素時,會發生 mouseenter 事件。該事件大多數時候會與mouseleave 事件壹起使用。

mouseleave() 當鼠標指針離開元素時,會發生 mouseleave 事件。該事件大多數時候會與mouseenter 事件壹起使用。

mousemove() 當鼠標指針在指定的元素中移動時,就會發生 mousemove 事件。

mouseout() 當鼠標指針從元素上移開時,發生 mouseout 事件。

mouseover() 當鼠標指針位於元素上方時,會發生 mouseover 事件。

mouseup() 當在元素上放松鼠標按鈕時,會發生 mouseup 事件。

resize() 當調整瀏覽器窗口的大小時,發生 resize 事件。

scroll() 當用戶滾動指定的元素時,會發生 scroll 事件。

select() 當 textarea 或文本類型的 input 元素中的文本被選擇時,會發生 select 事件。

submit() 當提交表單時,會發生 submit 事件。

unload() 在當用戶離開頁面時,會發生 unload 事件。jQuery效果

函數 描述

show() 顯示隱藏的匹配元素。

hide() 隱藏顯示的元素

toggle() 用於綁定兩個或多個事件處理器函數,以響應被選元素的輪流的 click 事件。

slideDown() 通過高度變化(向下增大)來動態地顯示所有匹配的元素,在顯示完成後可選地觸發壹個回調函數。

slideUp() 通過高度變化(向上減小)來動態地隱藏所有匹配的元素,在隱藏完成後可選地觸發壹個回調函數。

slideToggle() 通過高度變化來切換所有匹配元素的可見性,並在切換完成後可選地觸發壹個回調函數。

fadeIn() 通過不透明度的變化來實現所有匹配元素的淡入效果,並在動畫完成後可選地觸發壹個回調函數。

fadeOut() 通過不透明度的變化來實現所有匹配元素的淡出效果,並在動畫完成後可選地觸發壹個回調函數。

fadeTo() 把所有匹配元素的不透明度以漸進方式調整到指定的不透明度,並在動畫完成後可選地觸發壹個回調函數。

fadeToggle() 通過不透明度的變化來開關所有匹配元素的淡入和淡出效果,並在動畫完成後可選地觸發壹個回調函數。

animate()1.8* 用於創建自定義動畫的函數。

stop()1.7* 停止所有在指定元素上正在運行的動畫。

delay() 設置壹個延時來推遲執行隊列中之後的項目。

finish()1.9+ 停止當前正在運行的動畫,刪除所有排隊的動畫,並完成匹配元素所有的動畫。

jQuery.fx.off 關閉頁面上所有的動畫。

jQuery.fx.interval 設置動畫的顯示幀速。jQuery ajax操作

函數 描述

$.ajax() 通過 HTTP 請求加載遠程數據。

load() 載入遠程 HTML 文件代碼並插入至 DOM 中。

$.get() 通過遠程 HTTP GET 請求載入信息。

$.getJSON() 通過 HTTP GET 請求載入 JSON 數據。

$.getScript() 通過 HTTP GET 請求載入並執行壹個 JavaScript 文件。

$.post() 通過遠程 HTTP POST 請求載入信息。

ajaxComplete() AJAX 請求完成時執行函數。Ajax 事件。

ajaxError() AJAX 請求發生錯誤時執行函數。Ajax 事件。

ajaxSend() AJAX 請求發送前執行函數。Ajax 事件。

ajaxStart() AJAX 請求開始時執行函數。Ajax 事件。

ajaxStop() AJAX 請求結束時執行函數。Ajax 事件。

ajaxSuccess() AJAX 請求成功時執行函數。Ajax 事件。

$.ajaxPrefilter() Handle custom Ajax options or modify existing options before each request is sent and before they are processed by $.ajax().

$.ajaxSetup() 設置全局 AJAX 默認選項。

serialize() 序列化表格內容為字符串。

serializearray() 序列化表格元素 (類似 '.serialize()' 方法) 返回 JSON 數據結構數據。接下來,我們再給大家看壹下 jQuery常用語法及接口:

jQuery常用語法及接口

無論是寫程序還是看API文檔,要時刻註意區分Dom對象和jQuery包裝集。

1. Dom對象

在傳統的JavaScript開發中,都是首先獲取Dom對象,比如:

var p = document.getElementById("testp");

var ps = document.getElementsByTagName("p");使用document.getElementById方法根據id獲取單個Dom對象,或者使用document. getElementsByTagName方法根據HTML標簽名稱獲取Dom對象集合。

另外,在事件函數中,可以通過在方法函數中使用this引用事件觸發對象,或者使用event對象的target(FF)或srcElement(IE6)獲取引發事件的Dom對象。

這裏獲取的都是Dom對象,Dom對象也有不同的類型,如input、p、span等。Dom對象只有有限的屬性和方法,如圖6-2所示。

2. jQuery包裝集

jQuery包裝集可以說是Dom對象的擴充。在jQuery的世界中將所有的對象,無論是壹個還是壹組,都封裝成壹個jQuery包裝集,比如獲取包含壹個元素的jQuery包裝集:

var jQueryObject = $(&qu

  • 上一篇:個人博客到底是什麽東東啊
  • 下一篇:。asp購物車的itemtemplate裏有兩個按鈕,然後有壹個文本框放購買數量。我如何點擊按鈕來改變它?
  • copyright 2024編程學習大全網