最近進新公司直晨,讓我把jquery選擇器稍微再看下策泣,我就正好再整理一下jquery,關(guān)于jquery,我覺著最重要的也就是選擇器和事件了梢为,其中選擇器你必須記憶一番,你先要能夠選擇到你的對象技矮,然后給他添加事件抖誉,關(guān)于事件,你只要去看文檔衰倦,你想要什么效果袒炉,查一下就知道,jq關(guān)鍵還是選擇器吧樊零,鄙人之見而已我磁!
下面是我參照文檔整理的一些選擇器,和自己的一些理解(參考文獻驻襟,這個比w3c詳細點)
基本過濾選擇器
1夺艰,最常用的
#id
.class
element ? ?eg:$("div")
selector1,selector2,...selectorN 多個選擇器共同操作
2,層級選擇器
$("ancestor descendant")選取ancestor元素里的所有descendant元素后代
$("parent>child") 選取parent元素下的child元素沉衣,第一個子元素
eg:
我也是醉了郁副,html會被直接寫出來,果然沒有markdown好
$("pre + next")選取緊接在pre元素后的next元素
等價于$("pre").next("next")
$("pre~siblings") 選取pre元素之后的所有兄弟元素(有位置限定豌习,前面的就選不到了)
等價于$("pre").nextAll("div")
siblings()方法則與位置無關(guān)
3存谎,內(nèi)容過濾選擇器
:contains(text)
eg:$("div:contains("我")")選取含有文本"我"的div元素
:empty
eg:$("div:empty")選取不包含資源稅的div空元素
:has(selector)
eg:$("div:has(p)")選取含有P元素的div元素
:hidden 選取所有不可見的元素
eg: $("input:hidden")
:visible 選取所有可見的元素
獲取多選框選中的個數(shù):
$("input:checked").length
獲取下拉框選中的內(nèi)容(多一個空格表示他的子元素)
$("select ?:selected").text();
獲取title為test的div
$("div[title='test']");
獲取name是items且當前元素有checkbox的元素
$("[name=items]:checkbox")
獲取name是items的元素 有checkbox的子元素
$("[name=items] :checkbox")
4肥隆,偽類選擇器
在一堆相同元素中選擇(eg: 多個div)
:first ? 第一個
:last ?最后一個
:not(selector) 不包括
:even ?基數(shù)
:odd ?偶數(shù)
:eq(index)索引等于從0開始
:gt(index)大于
:lt(index)小于
:header 選取所有的標題
匹配如 h1, h2, h3之類的標題元素
:animated選取當前只在執(zhí)行動畫的所有元素
:lang(language) 指定語言的所有元素
$("div:lang(en)")將匹配
?and?
(和他們的后代
:hidden?匹配所有不可見元素既荚,或者type為hidden的元素
:focus?匹配當前獲取焦點的元素
5,其他
[attribute=value]匹配給定的屬性是某個特定值的元素
eg:$("input[name='newsletter']")