jQuery 選擇器

gghyoo 發(fā)布于2019-08-20 18:36 / 2312人閱讀

摘要：選擇器選擇器一基本選擇器語法說明選擇文檔中的所有元素元素選擇器，選擇所有的元素，返回數(shù)組選擇器，返回單個元素選擇器，返回數(shù)組并列選擇器，返回所有的元素和元素二層次選擇器語法說明后代選擇器，選擇所有元素下面的所有子元素，包含非直接

title: jQuery 選擇器
date: 2017-01-07 20:32:26

tags: [jQuery, 選擇器] 一、基本選擇器

二、層次選擇器

語法	說明
$("A B")	后代選擇器，選擇所有A元素下面的所有B子元素，包含非直接子節(jié)點
$("A > B")	子元素選擇器，選擇A下面的直接B子元素，不包含非直接子節(jié)點
$("A + B")	緊鄰兄弟元素選擇器，選擇A元素后面緊鄰的B元素，如果沒有不選中，等同于next()方法
$("A ~ B")	兄弟元素選擇器，選擇A后面所有的B元素，等同于nextAll()方法

三、過濾選擇器

1、基本過濾選擇器

2、內(nèi)容過濾選擇器

語法	說明
$("span : contains("hello")")	選取包含具體文本的元素
$("span : empty”)	選取不包含子元素或文本為空的元素
$("ol li : parent”)	選取包含子元素或文本不為空的元素
$("div : has(span)”)	選取子元素含有指定元素的元素，不是直系子元素也會生效

3、可見性過濾選擇器

語法	說明
$("div : hidden")	僅選取display:none或input type="hidden"的元素，不選取visibility: hidden或opacity:0的元素，也就是說:hidden只匹配那些“隱藏的”并且不占空間的元素
$("div : visible")	選取可見的元素

4、屬性過濾選擇器

四、表單選擇器

1、基本表單選擇器

語法	說明
$(":input")	選取所有的 input 元素
$(":text")	選取所有type="text"的 input 元素
$(":password")	選取所有type="password"的 input 元素
$(":radio")	選取所有type="radio"的 input 元素
$(":checkbox")	選取所有type="checkbox"的 input 元素
$(":submit")	選取所有type="submit"的 input 元素和button的元素
$(":reset")	選取所有type="reset"的 input 元素和button的元素
$(":button")	選取所有type="button"的 input 元素和所有標簽為button的元素
$(":image")	選取所有type="image"的 input 元素
$(":file")	選取所有type="file"的 input 元素

2、表單元素過濾選擇器

語法	說明
$(":enabled")	選擇所有啟用的 input 和 button 元素
$(":disabled")	選擇所有禁用（即設(shè)置了disabled="disabled"）的 input 和 button 元素
$(":selected")	選擇所有被選中下拉列表選項
$(":checked")	選擇所有被選中的復選框或單選按鈕元素

五、jQuery CSS 選擇器

jQuery CSS 選擇器可用于改變 HTML 元素的 CSS 屬性。

語法： jQuery選擇器.css("css屬性", "css屬性值");

$("div").css("background-color","red");

六、jQuery查找父、子、兄弟節(jié)點的方法

語法	說明
jQuery.parent(expr)	找父節(jié)點，可以傳入expr進行過濾，比如$("span").parent()或者$("span").parent(".class")
jQuery.parents(expr)	查找所有祖先元素，從父元素開始查找
jQuery.closest(expr)	查找第一個匹配的祖先元素，從當前元素開始查找
jQuery.children(expr)	返回所有子節(jié)點，這個方法只會返回直接的孩子節(jié)點，不會返回所有的子孫節(jié)點
jQuery.contents()	返回下面的所有內(nèi)容，包括節(jié)點和文本。
jQuery.prev()	返回上一個兄弟節(jié)點，不是所有的兄弟節(jié)點
jQuery.prevAll()	返回所有之前的兄弟節(jié)點
jQuery.next()	返回下一個兄弟節(jié)點，不是所有的兄弟節(jié)點
jQuery.nextAll()	返回所有之后的兄弟節(jié)點
jQuery.siblings()	返回兄弟姐妹節(jié)點，不分前后
jQuery.find(expr)	不會有初始集合中的內(nèi)容，比如$("p"),find("span"),是從子元素中找，等同于$("p span")
jQuery.filter(expr)	會有初始集合中的內(nèi)容