- N +

jquery類選擇器 jquery四種常用選擇器

jquery選擇不存在的元素如何做到不報錯的

剛好這個月在看jquery源碼,要回答這個問題,當然要從jquery源碼來看了;

在這兒,使用的是jquery2.0.3的版本源碼進行說明;如,我們使用jquery去查找一個頁面不存在的元素$('#test')元素,看下源碼具體走了哪些;在這兒就不一步一步進行源碼分析,只是進行簡單說明;

通過下圖代碼可以看出,調用$('#test')時,會走jquery.fn.init函數;然后我們去看下此函數;

由于函數代碼量過多,就不截圖;簡單說下,此函數會對傳入的“selector”進行分類及各種情況處理;而這兒我們就看是id為test情況;首先它會通過下圖判斷

然后,會通過一個正則“match=rquickExpr.exec(selector);”進行匹配,匹配"#test"結果match如下:

然后會走原生方法document.getElementById方法:

因為頁面本來沒有此元素,所以會直接返回空(null),最后會走下圖代碼,返回最終結果由上圖代碼可知,即使返回結果為空,它也會返回一個jquery對象,里面包含context、selector屬性,還有繼承的jquery全局方法,結果如下圖:所以,如果你即使查找一個沒有的元素,它也會返回一個jquery對象,你也可以直接使用對象中所有的jquery全局方法;

上面只是用id的簡單的方式,如果是類、標簽、css等其他復雜的進行查找時,jquery會根據類型和瀏覽器的版本不同,使用不同的方式進行查找,但最終返回結果都差不多,而且即使沒有,都會返回一個jquery對象;

jquery的所有插件

jquery的插件有:

1、jQuery表單驗證插件:Validation

(1)Validation簡介

????最常使用JavScript的場合就是表單的驗證,而jQuery作為一個優秀的JavaScript庫,也提供了一個優秀的表單驗證插件——Validation.Validation是歷史最悠久的jQuery插件之一,經過了全球范圍內不同項目的驗證,并得到了許多Web開發者的好評。作為一個標準的驗證方法庫,Validation擁有如下優點:

內置驗證規則:擁有必填、數字、E-Mail、URL和信用卡號碼等19類內置驗證規則

自定義驗證規則:可以很方便地自定義驗證規則

簡單強大的驗證信息提示:默認了驗證信息提示,并提供自定義覆蓋默認提示信息的功能

實時驗證:可以通過keyup或blur事件觸發驗證,而不僅僅在表單提交的時候驗證。

2、jQuery表單插件:Form

(1)Form插件簡介

????jQueryForm插件是一個優秀的Ajax表單插件,可以非常容易地、無侵入地升級HTML表單以支持Ajax。jQuery有兩個核心方法——ajaxForm()和ajaxSubmit(),它們集合了從控制表單元素到決定如何管理提交進程的功能。另外iain,插件還包括其他的一些方法:formToArray()、formSerialize()、fieldSerialize()、fieldValue()、clearForm()和resetForm()等

3、動態綁定事件插件:livequery

(1)livequery插件簡介

????jQuery的事件綁定功能使得jQuery代碼與HTML代碼能夠完全分離,這樣代碼的層次關系更加清晰,維護起來也更加簡單。然而對于動態加載到頁面的HTML元素,每次都需要重新綁定事件到這些元素上,十分不便。一款新的插件由此產生,即livequery,可以利用它給相應的DOM元素注冊時間或者觸發回調函數函數。不僅當前選擇器匹配的元素會被綁定事件,而且后來通過JavaScript添加的元素都會被綁定事件。當元素不再和選擇器匹配時,livequery會自動取消事件注冊,使得開發者不再需要關注HTML元素的來源,只需要關注如何編寫其綁定的事件即可。

????通過jQuery選擇器選擇一個DOM元素,livequery插件會實時地在整個DOM范圍將其持久化。這意味著無論元素是先前存在的還是后來動態加載的,事件都會被綁定,就像是CSS給元素添加樣式一樣。同時,這款插件幾乎在沒占用什么資源的情況下就做到了這些功能。

4、jQueryUI插件

(1)jQueryUI簡介:

???jQueryUI源自于一個jQuery插件——Interface。Interface插件最早版本我1.2,只支持jQuery1.1.2的版本,后來有人對Interface的大部分代表基于jQuery1.2的API進行重構,并統一了API。由于改進重大,因此版本號不是1.3而是直接跳到1.5,并且改名為jQueryUI。

????jQueryUI主要分為3個部分,交互、微件和效果庫

交互。這里都是一些與鼠標交互相關的內容。包括拖動,置放,縮放,選擇和排序等待。微件(Widget)中有部分是基于這些交互組建來制作的。此庫需要一個jQueryUI核心庫——ui.core.js支持

微件。這里主要是一些界面的擴展。里邊包括了手風琴導航,自動完成,取色器,對話框,滑塊,標簽,日歷,放大鏡,進度條和微調控制器等待。此庫需要一個jQueryUI核心庫——ui.core.js支持

效果庫。此庫用于提供豐富的動畫效果,讓動畫不再局限于animate()方法。效果庫有自己的一套核心即effects.core.js,無需jQuery的核心庫ui.core.js支持

5、管理Cookie的插件:Cookie

(1)Cookie插件簡介

????Cookie是網站設計者放置在客戶端的小文本文件。Cookie能為用戶提供很多的便利,例如購物網站存儲用戶曾經瀏覽過的產品列表,或者門戶網站記住用戶喜歡選擇瀏覽哪類新聞。在用戶運行的情況下,還可以存儲用戶的登陸情況,使得用戶在訪問網站時不必每次都鍵入這些信息。

????jQuery提供了一個十分簡單的插件來管理網站的Cookie,該插件的名稱也是Cookie.

6、模態窗口插件:SimpleModal

(1)SimpleModal插件簡介

????SimpleModal是一個輕量級的jQuery插件,它為模態窗口的開發提供了一個強有力的接口,可以把它當作模態窗口的框架。SimpleModal非常的靈活,可以創建你能夠想象到的任何東西i,并且你還不需要考慮UI開發中的跨瀏覽器相關問題。

如何用jquerymobile開發webapp

jQueryMobile是一個基于jquery的html5移動網站框架,用它做出來的網站界面和App風格類似。jQueryMobile文檔,內容不多,耐心看完只需要1個小時,大體分成8大功能點page:最基準單元,包括header,footer,導航欄dialog:對話框,在手機屏幕彈出dialog來交互,我覺得不是很友好transitions:轉場效果form:表單button:大button,小button(放在各種欄上的都是小button),還提供了若干內置標準iconlistview:列表,這是jquerymobile的核心UI,提供了10幾種類型的List,簡單好用event:各種滾動,滑動,拖拽事件Theming:官方提供了5種皮膚,也有工具可以自定義,切換皮膚只需要改動一個classjQueryMobile全面支持ajax,但也可以當做普通html模板在后端渲染數據,我選擇后面一種

jqueryselect怎么設置,有默認的選中值,但是不能選擇

<body><selectid="select_disable"><optionvalue="1">1</option><optionvalue="2">1</option><optionvalue="3">1</option><select></body>

<script>$("#select_disable").attr("disabled","disabled").css("background-color","#EEEEEE");</script>

用jquery的attr方法給select控件添加disabled屬性

由于即使是被禁止選擇了,下拉框還是會顯示白色,這樣可能會讓用戶產生誤解,可以再加上一個灰色的背景色

從哪里開始學習jQuery

按這個順序學習

jQuery教程http://codingdict.com/article/7359

jQuery簡介

jQuery入門

jQuery語法

jQuery選擇器

jQuery事件

jQuery隱藏和顯示

jQuery漸入漸出

jQuery滑動

jQuery動畫

jQuery停止

jQuery回調

jQuery方法鏈

jQuerydom_get

jQuerydom_set

jQuerydom_add

jQuerydom_remove

jQueryCSS類

jQuerycss()方法

jQuery尺寸

jQuery遍歷

jQuery遍歷父元素

jQuery遍歷子元素

jQuery遍歷兄弟元素

jQuery縮小遍歷范圍

jQueryajax簡介

jQueryajax_load

jQueryajax_get_post

jQuerynoConflict()方法

jquery如何獲取checkbox的選中個數

先選擇所有的input

再遍歷篩選出checkbox或者加個統一的class,再按class進行選擇。另外,用jQuery可能會方便一下。

返回列表
上一篇:
下一篇: