jQuery學(xué)習(xí)筆記之jQuery選擇器的使用
一.基本選擇器:
- #id :選擇給定ID名的元素 如:$("#id1")為選擇id為id1的元素
- .class :選擇給定類名的元素
- element :選擇給定元素名的所有原色
- * :匹配所有元素
- selector1,selector2,...... :選擇這些名稱的元素,以逗號(hào)隔開,可以是類或id名
二.層次選擇器:
- $("ancestor descendant") :選擇ancestor元素下的所有descendant(后代)元素
- $("parent>child") :選擇parent下的所有child(子)元素
- $('prev+next') :選擇緊跟prev后面的第一個(gè)next元素
- $('prev~siblings') :選擇prev后面的所有siblings元素
$('prev+next') 和$(.prev).next("next")作用一樣
$('prev~siblings')和$(.prev).nextAll("siblings")作用一樣
三.過濾選擇:
- :first 選擇第一個(gè)元素 如:$("div:first")為選擇第一個(gè)div元素
- :last 選擇最后一個(gè)元素
- :not(selector) 選擇不是selector的元素
- :even 選擇偶數(shù)索引的元素
- :odd 選擇所有奇數(shù)索引的元素
- :eq(index) 選擇索引等于index的元素
- :gt(index) 選擇索引大于index的元素
- :lt(index) 選擇索引小于index的元素
- :header 選擇所有<H>元素
- :animanted 選擇所有動(dòng)畫元素
四。內(nèi)容過濾:
- :contains(text) 選擇含有text文本的元素 如:$("div:contains('hello')")為選擇含有hello字符的div元素
- :empty 選擇所有不含字符的元素
- :has(selector) 選擇含有selector元素的元素
- :parent 選擇含有子元素的元素
五??梢娦赃^濾:
- :hidden 選擇所有可見元素
- :visible 選擇所有不可見元素
六。屬性過濾:
- [attribute] 選擇擁有此屬性的元素 如$("div[id]")選擇包含id屬性的div元素
- [attribute=value] 選擇attribute屬性等于value值的元素
- [attribute!=value] 選擇attribute屬性不等于value值的元素
- [attribute^=value] 選擇attribute屬性等于value值的元素
- [attribute$=value] 選擇attribute屬性值以value值開始的元素
- [attribute*=value] 選擇attribute屬性值含有value值的元素
- [selector1][selector2]....滿足這些條件的元素(組合)
七。子元素過濾選擇器
- :nth-child(index/even/odd/eqation)選擇父元素下的[索引/偶/奇]的子元素
- :first-child 選擇父元素的第一個(gè)子元素
- :last-child選擇父元素的最后一個(gè)子元素
- :only-child 選擇父元素下是唯一的子元素
八。表單屬性過濾
- :enabled 選擇所有可見元素 如:$("#form1:enabled")是選擇表單id為form1的所有可以用元素
- :disable 選擇所有不可見元素
- :checked 選擇所有被選擇的元素
- :selected 選擇所有被選中的選項(xiàng)元素
九.表單對(duì)象過濾
- :input 選擇所有<input><textarea><select><button>元素
- :text 選擇所有單行文本款,下面的都是這個(gè)格式
- :password
- :radio
- :checkbox
- :submit
- :image
- :reset
- :button
- :file
- :hidden
相關(guān)文章
jquery 學(xué)習(xí)之一 對(duì)象訪問
jquery 學(xué)習(xí)之一 對(duì)象訪問整理,學(xué)習(xí)jquery的朋友可以參考下。2010-11-11jQuery實(shí)現(xiàn)查找最近父節(jié)點(diǎn)的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)查找最近父節(jié)點(diǎn)的方法,涉及jQuery針對(duì)元素節(jié)點(diǎn)操作的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06jquery實(shí)現(xiàn)異步文件上傳ajaxfileupload.js
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)異步文件上傳ajaxfileupload.js,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-10-10jquery判斷checkbox(復(fù)選框)是否被選中的代碼
現(xiàn)在很多朋友都喜歡使用jquery了,所以很多的表格判斷都是基于jquery的,但實(shí)現(xiàn)方法與javascript原生代碼不同,對(duì)于checkbox的判斷大家可以參考下。2010-10-10輕松學(xué)習(xí)jQuery插件EasyUI EasyUI創(chuàng)建樹形網(wǎng)絡(luò)(1)
這篇文章主要幫助大家輕松學(xué)習(xí)jQuery插件EasyUI,并且教大家如何利用EasyUI創(chuàng)建樹形網(wǎng)絡(luò),感興趣的小伙伴們可以參考一下2015-11-11javascript loadScript異步加載腳本示例講解
本文講解了javascript異步加載腳本并觸發(fā)回調(diào)函數(shù)的方法,在加載遠(yuǎn)程數(shù)據(jù)的時(shí)候可以用到,下面提供代碼示例和源碼2013-11-11探討JQUERY JSON的反序列化類 using問題的解決方法
本篇文章是對(duì)JQUERY JSON的反序列化類 using問題的解決方法進(jìn)行了詳細(xì)的分析介紹,需要的朋友可以過來參考下,希望對(duì)大家有所幫助2013-12-12dreamweaver 8實(shí)現(xiàn)Jquery自動(dòng)提示
這篇文章主要介紹了dreamweaver 8實(shí)現(xiàn)Jquery自動(dòng)提示的方法,需要的朋友可以參考下2014-12-12基于DOM節(jié)點(diǎn)刪除之empty和remove的區(qū)別(詳解)
下面小編就為大家?guī)硪黄贒OM節(jié)點(diǎn)刪除之empty和remove的區(qū)別(詳解)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-09-09