前言:
前面學(xué)習(xí)了JQuery的簡(jiǎn)單使用,今天進(jìn)一步學(xué)習(xí)一下JQuery的選擇器。
什么是選擇器?
JQuery選擇器通過(guò)標(biāo)簽名、屬性名或者內(nèi)容對(duì)DOM元素進(jìn)行快速準(zhǔn)確的選擇,而不必?fù)?dān)心瀏覽器的兼容性,通過(guò)JQuery選擇器對(duì)頁(yè)面元素精確定位,進(jìn)而方便完成處理元素屬性和行為事件。
選擇器的優(yōu)勢(shì)
與傳統(tǒng)的JavaScript獲取頁(yè)面元素和事務(wù)處理相比,JQuery具備以下幾個(gè)優(yōu)勢(shì):
代碼比較簡(jiǎn)單
完善的檢測(cè)機(jī)制
1、)代碼更簡(jiǎn)單
在JQuery庫(kù)中封裝了大量可以通過(guò)選擇器直接調(diào)用的函數(shù),使編程更加簡(jiǎn)單輕松,使用簡(jiǎn)單的代碼就可以使用相對(duì)復(fù)雜的功能。
2、)完善的檢測(cè)機(jī)制
傳統(tǒng)js設(shè)置頁(yè)面元素的事務(wù)的時(shí)候,先要找到頁(yè)面上的元素,然后在賦予相應(yīng)的屬性或事件,如果頁(yè)面元素不存在,則頁(yè)面會(huì)報(bào)錯(cuò)。所以要先判斷頁(yè)面元素是否存在。再進(jìn)行屬性或者事件操作。這樣會(huì)造成代碼繁瑣。在JQuery定義頁(yè)面元素的時(shí)候,無(wú)須考慮頁(yè)面中是否存在,即使頁(yè)面中不存在該元素也不會(huì)報(bào)錯(cuò),極大的方便了代碼的執(zhí)行效率。
選擇器分類(lèi)
大致分為下面四大類(lèi)
基本選擇器
層次選擇器
過(guò)濾選擇器
表單選擇器
過(guò)濾選擇器又分為以下幾個(gè)小分類(lèi)
簡(jiǎn)單過(guò)濾選擇器
內(nèi)容過(guò)濾選擇器
可見(jiàn)性過(guò)濾選擇器
屬性過(guò)濾選擇器
子元素過(guò)濾選擇器
表單對(duì)象屬性過(guò)濾選擇器
接下來(lái)挨個(gè)學(xué)習(xí)一下。
基礎(chǔ)選擇器
#id 根據(jù)Id匹配一個(gè)元素 返回的單個(gè)元素
.class 根據(jù)給定的類(lèi)名匹配一個(gè)元素 返回的是元素集合
element 根據(jù)元素名匹配一個(gè)元素 返回的是元素集合
* 匹配所有元素 返回的是元素集合
selecttor1,selector2并集,返回兩個(gè)選擇器匹配到的元素 返回的是元素集合
延伸閱讀
- ssh框架 2016-09-30
- 阿里移動(dòng)安全 [無(wú)線安全]玩轉(zhuǎn)無(wú)線電——不安全的藍(lán)牙鎖 2017-07-26
- 消息隊(duì)列NetMQ 原理分析4-Socket、Session、Option和Pipe 2024-03-26
- Selective Search for Object Recognition 論文筆記【圖片目標(biāo)分割】 2017-07-26
- 詞向量-LRWE模型-更好地識(shí)別反義詞同義詞 2017-07-26
- 從棧不平衡問(wèn)題 理解 calling convention 2017-07-26
- php imagemagick 處理 圖片剪切、壓縮、合并、插入文本、背景色透明 2017-07-26
- Swift實(shí)現(xiàn)JSON轉(zhuǎn)Model - HandyJSON使用講解 2017-07-26
- 阿里移動(dòng)安全 Android端惡意鎖屏勒索應(yīng)用分析 2017-07-26
- 集合結(jié)合數(shù)據(jù)結(jié)構(gòu)來(lái)看看(二) 2017-07-26