一、說明
獲取元素的方法分為兩種：jQuery選擇器、jQuery遍歷函數。
做個總結，鞏固下知識。
二、獲取本身
1、只需要一種jQuery選擇器
| 選擇器 | 實例 | 說明 |
| #Id | $('#myId') | ID選擇器： 可以獲取到ID為“myId”的元素，區分大小寫 |
2、多種jQuery選擇器組合
分為兩部分：前半部分獲取到的是一個元素集合，后半部分可以精確為一個元素，兩者相結合，可以獲取到想要的元素。
1）前半部分選擇器
| 選擇器 | 實例 | 說明 |
| .class | $('.myClass') | 類選擇器：可以獲取到class為‘myClass’的所有元素 |
| element | $('p') | 獲取所有的<p>元素 |
| :header | $(':header') | 獲取所有的標題元素：<h1> ~ <h6> |
| :animated | $(':animated') | 獲取所有的動畫元素 |
| :contains(text) | $('p:contains(Hello)') | 獲取所有包含文本為Hello的<p>元素，中間的文本區分大小寫 |
| :hidden | $(':hidden') | 獲取所有的隱藏元素：width和height為0、display:none、type=hidden、 |
| [attribute] | $('[href]') | 屬性選擇器：獲取所有含有屬性為href的元素 |
| [attribute=value] | $('[href=a.html]') | = 獲取所有帶有屬性href，並且值為a.html的元素 != 獲取所有帶有屬性href，並且值不等於為a.html的元素 $= 獲取所有帶有屬性href，並且值以a.html結尾的元素 ^= 獲取所有帶有屬性href，並且值以a.html開頭的元素 ~= 獲取所有帶有屬性href，並且值包含單詞”a.html“的元素 *= 獲取所有帶有屬性href，並且值包含文本”a.html“的元素 |
| :input | $(':input') | 獲取所有input元素 |
| :radio | $(':radio') | 所有帶有 type="radio" 的 input 元素 相似的有： :text、:chexbox、:password、:submit、:reset、:button、:file |
| :enabled | $(':enabled') | 所有啟用的input元素。 :disabled 則相反 |
| :checked | $(':checked') | 所有選中的input選擇（單選框、復選框） |
| :gt(index) | $('p:gt(2)') | index從0開始，獲取index大於（不包含）2的所有<p>元素 |
| :lt(index) | $('p:lt(2)') | index從0開始，獲取index小於（不包含）2的所有<p>元素 |
| :even | $('tr:even') | 所有偶數<tr>元素 |
| :odd | $('tr:odd') | 所有奇數<tr>元素 |
2）后半部分選擇器：可以精確到某一個元素
| 選擇器 | 實例 | 說明 |
| :first | $('p:first') | 第一個<p>元素 |
| :last | $('p:last') | 最后一個<p>元素 |
| :eq(index) | $("p:eq(1)") | 第二個<p>元素，index從0開始 |
3、jQuery選擇器+遍歷函數
也是分為兩部分：前半部分用選擇器獲取到一個元素集合，后半部分用遍歷函數精確為某個元素
1）前半部分同上
2）后半部分：遍歷函數
| 方法 | 描述 |
| eq() | 返回帶有被選元素的指定索引號的元素 |
| first() | 返回被選元素的第一個元素 |
| last() | 返回被選元素的最后一個元素 |
三、獲取同級元素
顧名思義：獲取選中元素的同級元素。首先需要定位到該元素（上面已有總結，不再重復），然后獲取它的同級元素。
1）選擇器
| 選擇器 | 實例 | 說明 |
| element + next | $('div + p') | 每個div相鄰的下一個<p>元素 |
| element ~ siblings | $('div ~ p') | 獲取跟div同級的所有的<p>元素 |
2）遍歷函數
| 方法 | 描述 |
| next() | 返回被選元素的后一個同級元素 |
| nextAll() | 返回被選元素之后的所有同級元素 |
| prev() | 返回被選元素的前一個同級元素 |
| prevAll() | 返回被選元素之前的所有同級元素 |
四、獲取父級元素
獲取選中元素的父級元素
1）選擇器
| 選擇器 | 實例 | 說明 |
| :parent | $('p:parent') | 獲取所有p元素的父級元素 |
2）遍歷函數
| 方法 | 描述 |
| parent() | 獲取被選元素的父級元素 |
| parents() | 獲取被選元素的所有祖先元素 |
五、獲取子級元素
獲取選中元素的子級元素
1）選擇器
| 選擇器 | 實例 | 說明 |
| parent > child | $('div > p') | 獲取div直接子元素的所有<p>元素 |
| parent descendant | $('div p') | 獲取div所有后代的<p>元素 |
2）遍歷函數
| 方法 | 描述 |
| children() | 返回被選元素的所有直接子元素 |
| contents() | 返回被選元素的所有直接子元素(包含文本和注釋節點) |
| find() | 返回被選元素的后代元素 |