明鏡臺(tái)原創(chuàng)（轉(zhuǎn)載請(qǐng)保留）?
1、Jquery學(xué)習(xí)筆記（一）---- 前言

2、Jquery學(xué)習(xí)筆記（二）---- 強(qiáng)大的選擇器

JQuery的選擇器十分強(qiáng)大，本章主要講的是如何靈活應(yīng)用選擇器。根據(jù)手冊(cè)，選擇器被分為以下9類。分別是：
1、基本；
2、層級(jí)；
3、基本對(duì)象屬性；
4、內(nèi)容；
5、可見性；
6、屬性；
7、子元素；
8、表單；
9、表單對(duì)象屬性；

注意：所有的選擇都是返回對(duì)象數(shù)組；返回值:Array<Element(s)>

一、首先我來(lái)介紹的是選擇器的最基本是用方式。基本方式由以下幾種方式集合而成的，有最基礎(chǔ)的，ID("#id")選擇，元素(element)選擇，還有類選擇（.class），所有匹配選擇（*），多選擇（'選擇1，選擇2，選擇3'）；
?????? 示例：

從上面大家看到什么呢？是不是覺(jué)得上面的選擇器是否跟CSS的選擇器十分相似呢，其實(shí)JQUERY的選擇器就是根據(jù)CSS來(lái)選擇的，我們可以從第一節(jié)中看到，維基的解析，在使用基本選擇發(fā)上是按照CSS來(lái)的，也比DOM靈活性強(qiáng)。

二、層級(jí)；在CSS里我們的層級(jí)上一般是使用">"來(lái)表示選擇某個(gè)元素的子元素，（應(yīng)該是叫元素吧！其實(shí)我都不知道叫啥）在JQUERY里你依然可以延用這類的選擇方式，如果你覺(jué)得比較難記的話，可以這樣記憶，所有CSS的 選擇模式，在JQUERY里都是支持的。在JQUERY里層級(jí)里有4種選擇方式，分別是:"空格"作為分隔符，">"作為分隔符，"+"作為分隔符,"~"作為分隔符
這4種層級(jí)選擇方式空格是匹配某元素后的后代元素，而>在限定性上要嚴(yán)格得多，例如
<div><p>aaa</p><ul><li><p>cc</p></li></ul></div>
$("div>p")這個(gè)P元素必須是DIV元素的子元素我們找到的是內(nèi)容為AAA的P元素，而使用$("DIV P")這樣的選擇器我們不單純找到內(nèi)容為AAA的P元素而且找到內(nèi)容為CC的P元素。其實(shí)很多人對(duì)CSS上更多的是使用空格這種方式去限定的，但是空格的嚴(yán)謹(jǐn)性上有一定的問(wèn)題，如果想找某一確定元素用">"要比"空格"要好的，
“+”這個(gè)分割符號(hào)最大別的是選擇的元素是配對(duì)的，也就是說(shuō)，$("P+UL")只有在 P后面跟著UL標(biāo)記的才選擇。
“～”是同級(jí)分割符號(hào)，表示兩個(gè)分割符同深度的才選擇
這類層級(jí)選擇是分割符后面的元素才是選定的元素，分割符前面的元素是起限制作用的，查找的是分割符后面的元素，這個(gè)比較容易搞混，尤其是一些初次使用JQUERY的。

三、從第三開始都是用":"作為分割符的了這部分是令你靈活運(yùn)用選擇器的重點(diǎn)。基本對(duì)象屬性，分別是：first（匹配找到的第一個(gè)元素），last（匹配找到的最后一個(gè)元素），not（去除所有與給定選擇器匹配的元素），even（匹配所有索引值為偶數(shù)的元素，從 0 開始計(jì)數(shù)），odd（匹配所有索引值為奇數(shù)的元素，從 0 開始計(jì)數(shù)），eq（匹配一個(gè)給定索引值的元素），gt（匹配所有大于給定索引值的元素），lt（匹配所有小于給定索引值的元素），header（匹配如 h1, h2, h3之類的標(biāo)題元素），animated（匹配所有正在執(zhí)行動(dòng)畫效果的元素）

具體應(yīng)用看例子：
四、內(nèi)容選擇分為4個(gè)：contains（匹配包含給定文本的元素），empty（判空），has（匹配含有選擇器所匹配的元素的元素）parent（匹配含有子元素或者文本的元素），empty和parent是對(duì)立的。一個(gè)是空，一個(gè)是非空。至于如何靈活使用，就看自己了。

五、可見性選擇器，從名字我們可以猜到，這個(gè)應(yīng)該是由兩個(gè)組成的，分別是：hidden和visible這個(gè)也是在正常應(yīng)用中應(yīng)用的最多的，例如我們要實(shí)現(xiàn)，當(dāng)鼠標(biāo)經(jīng)過(guò)某個(gè)鏈接顯示某個(gè)層的時(shí)候，在選擇上就可以使用可見性選擇，一般網(wǎng)站開發(fā)都有很多隱藏層，所以這個(gè)可見性選擇功能我覺(jué)得還是十分好用的。

六、屬性選擇器，這個(gè)部分是一個(gè)重點(diǎn)，記憶點(diǎn)也不多，就是幾個(gè)判斷，第一判斷存在不存在這個(gè)屬性，屬性等于某個(gè)值，屬性不等某個(gè)值，屬性的值是以某個(gè)字符串開始，屬性的值是以某個(gè)字符串結(jié)尾，屬性的值只要包含某個(gè)字符串最后就是同時(shí)檢測(cè)多個(gè)屬性，在手冊(cè)里你可以看到：[attribute],[attribute=value],[attribute!=value],[attribute^=value],[attribute$=value],[attribute~=value],"[attribute],[attribute]...."
既然我們學(xué)多了一個(gè)新的選擇方式，依照剛剛那道面試題目我們可以怎么實(shí)現(xiàn)呢？

$("input[type=text]")實(shí)現(xiàn)的方式是使用屬性選擇器，而上面講的則是表單選擇器。

至于余下的表單屬性對(duì)像，表單等選擇器方式可以自己查看手冊(cè)，因?yàn)槭謨?cè)演示得十分清晰。下面我們找一個(gè)網(wǎng)來(lái)做下聯(lián)系，
使用以下網(wǎng)站吧：時(shí)尚專屬

這一部分是一個(gè)演示商品的原代碼。現(xiàn)在我要更改這個(gè)網(wǎng)站的部分功能個(gè)，我要將在所有的submit按鈕的“加入購(gòu)物車”下改加入一個(gè)檢測(cè)語(yǔ)句，提示用戶是否加入，我們要如何查找這個(gè)商品頁(yè)面內(nèi)的submit呢？
??? 根據(jù)屬性選擇：input:submit我們可以查看到所有的submit按鈕，但是我們不能保證這些按鈕都是屬于演示商品的，所以我們需要用用更復(fù)雜的語(yǔ)句，根據(jù)上面的代碼我們可以看出，所有用于層列商品的都是用了一個(gè)類“floatindex”這樣我們就可以這樣做，
$(".floatindx input:submit")到底可以不可以抓到？我也不知道哈哈，理論上可以。
其實(shí)我們可以怎么實(shí)現(xiàn)？有更方便的方法，也是我比較喜歡用的方法
$("input[type=submit][value~=加入購(gòu)物車]")這個(gè)方法是使用了多屬性搜查選擇器。

從以上例子可以看出，我們要如何使用 jquery去選擇某個(gè)對(duì)象，完全取決你如何去選擇，只要你善于分析，頁(yè)面上的任何東西，你都可以準(zhǔn)確的抓到，并進(jìn)行加工。