明鏡臺原創（轉載請保留） 
1、Jquery學習筆記（一）---- 前言

2、Jquery學習筆記（二）---- 強大的選擇器

JQuery的選擇器十分強大，本章主要講的是如何靈活應用選擇器。根據手冊，選擇器被分為以下9類。分別是：
1、基本；
2、層級；
3、基本對象屬性；
4、內容；
5、可見性；
6、屬性；
7、子元素；
8、表單；
9、表單對象屬性；

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

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

從上面大家看到什么呢？是不是覺得上面的選擇器是否跟CSS的選擇器十分相似呢，其實JQUERY的選擇器就是根據CSS來選擇的，我們可以從第一節中看到，維基的解析，在使用基本選擇發上是按照CSS來的，也比DOM靈活性強。

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

三、從第三開始都是用":"作為分割符的了這部分是令你靈活運用選擇器的重點。基本對象屬性，分別是：first（匹配找到的第一個元素），last（匹配找到的最后一個元素），not（去除所有与给定选择器匹配的元素），even（匹配所有索引值为偶数的元素，从 0 开始计数），odd（匹配所有索引值为奇数的元素，从 0 开始计数），eq（匹配一个给定索引值的元素），gt（匹配所有大于给定索引值的元素），lt（匹配所有小于给定索引值的元素），header（匹配如 h1, h2, h3之类的标题元素），animated（匹配所有正在执行动画效果的元素）

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

五、可見性選擇器，從名字我們可以猜到，這個應該是由兩個組成的，分別是：hidden和visible這個也是在正常應用中應用的最多的，例如我們要實現，當鼠標經過某個鏈接顯示某個層的時候，在選擇上就可以使用可見性選擇，一般網站開發都有很多隱藏層，所以這個可見性選擇功能我覺得還是十分好用的。

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

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

至于余下的表單屬性對像，表單等選擇器方式可以自己查看手冊，因為手冊演示得十分清晰。下面我們找一個網來做下聯系，
使用以下網站吧：時尚專屬

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

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