jq 中常見的選擇器

1 基本選擇器
id選擇器 #id $("#test")
class 選擇器 .class $(".test")
元素選擇器 element $(p) $(img)
通配符選擇器 $("*") 匹配全部元素 動畫

2 層次選擇器
$("div span") 選取div 裏面全部的span
$("parent>child") 選取 parent 元素下的child 子元素
$("prev + next") 選取緊接在prev元素後的next元素
$(".one+div") 等價於$(".one").next("div")
$("prev~sibkings") 選取prev 元素以後的全部siblings 元素
$("#prev~div") 等價於 $("#prev").nextAll("div")spa

3 過濾選擇器對象

3.1 基本過濾選擇器
:first 選取第一個元素 $("div:first")
:last 選取最後一個元素 $("div:last")
:even 選取索引是偶數的全部元素 索引從0開始
:odd 選取索引是奇數的全部元素 索引從1開始
:eq(index) 選取索引等於index 的元素 索引從0開始
:gt(index) 選取索引大於index 的元素 索引從0開始
:lt(index) 選取索引小於index 的元素 索引從0開始
:header 選取全部的標題元素 eg: h1 h2 h3
:animated 選取當前正在執行動畫的全部元素索引

3.2 內容過濾選擇器
:contains(text) 選取含有文本內容text的元素
:empty 選取不包含子元素或文本的空元素
:has(selector) 選取含有選擇器全部匹配元素的元素
:parent 選取含有子元素或文本的元素element

3.3 可見性過濾選擇器
:hidden 選取全部不可見的元素 $(":hidden")
$(":hidden")選取全部不可見元素。
包括:<input type="hidden"/>
<div style="display:none;">
<div style="visibility=hidden">等元素。
:visible 選取全部可見元素input

3.4 屬性過濾選擇器
[attribute] 選取擁有此屬性的元素
[attribute = value] 選取屬性值爲value的元素
[attribute !=value] 選取屬性值不等於value的元素
[attribute^=value] 選取屬性值以value開始的元素
[attribute $=value] 選取屬性值以value 結束的元素
[attribute *=value] 選取屬性值含有value值的元素it

3.5 子元素過濾選擇器
:first-child 選取每一個父元素下第一個子元素
:last-child 選取每一個父元素下的最後一個子元素
:only-child 若是某個元素是他父元素中惟一的一個子元素,那麼將會被匹配,
若是父元素中含有其餘的元素將不會匹配io

3.6 表單對象屬性過濾選擇器
:enabled 選取全部可用的元素
:disabled 選取全部不可用的元素
:checked 選取全部被選中的元素(單選框、複選框)
:selected 選取全部被選中的選項元素(下拉列表)ast

4 表單選擇器
:input 選中全部input textarea select button 元素
:text 選取全部單行文本框
:password 選取全部密碼框
:radio 選取全部單選框
:checkbox 選取全部多選框
:submit 選取全部的提交按鈕
:file 選取全部的上傳域
:hidden 選取全部不可見元素class

5 得到兄弟元素的方法next() 當前元素以後的近鄰的第一個兄弟元素nextAll() 當前元素以後的全部的兄弟元素prev() 當前元素以前的近鄰的兄弟元素prevAll() 當前元素以前的全部的兄弟元素sibling() 當前元素的全部的兄弟元素

相關文章
相關標籤/搜索