jQuery 选择器

jQuery 选择器允许你对 HTML 元素组或单个元素进行操作。

jQuery 选择器基于元素的 id、类、类型、属性、属性值等"查找"（或选择）HTML 元素。  

jQuery 中所有选择器都以美元符号开头：$()。

以下是初学jQuery 整理的笔记！

1基本选择器

• 1.标签名选择器$("div");
• 2. id选择器$("#id");
• 3. 类选择器$(".class");
• 4.任意元素选择器$("*"）;

2 层级选择器

• 1. 匹配所有子元素及后代元素$("div span");
• 2 子元素选择器$("div>span");
• 3 相邻元素选择器$("div+span");
• 4 匹配div后面的所有的兄弟span $("div~span");

3 层级函数

• 1 获取元素的所有兄弟
•         $("#two").siblings("div");
• 2 获取元素的哥元素
•         $("two").prev("div");
• 3 获取元素的哥哥们元素
•         $("#two").prevAll("div")
• 4 获取元素的弟弟元素
•         $("#two").next("div")
• 5 获取元素的弟弟们元素
•         $("two").nextAll("div")

4 过滤选择器

• 1 匹配所的div中的第一个元素$("div:first")
• 2匹配所有div中的最后一个元素$("div:last")
• 3 匹配所有div中的偶数     0 2 4 6 8     $("div:even")
• 4 匹配所有的div中的奇数    $("div:odd")
• 5 匹配所有div中下标为n的      $("div:gt()")
• 6 匹配所有div中下标小于n的        $("div:lt(n)")
• 7 匹配所有div 中下标大于n的        $("div:gt(n)")
• 8 匹配所有div中class 值不为one 的   $("div:not(.one)")

5 内容选择器

• 1 匹配的所有包含 p 标签的 div     $("div:has(p)")
• 2 匹配所有空的     div $("div:empty")
• 3  匹配所有非空的 div $("div:parent")
• 4 匹配文本内容包：内容  $("div:contains('内容')")

6 可见选择器

• 1 匹配的以隐藏的元素
•         $("div:hidden")
• 2. 匹配所有显示的元素
•         $("div:visible")

7 隐藏和显示相关的函数

• 1. 隐藏元素
•     $("div:visible").hide()
• 2. 显示元素
•     $("#id").show()
• 3. 隐藏和显示切换
•     $("#id").toggle()

8 属性选择器

• 1. 匹配有id属性的div元素 
•     $("div[id]")
• 2. 匹配有id并且值为d1的元素
•     $("div[id='d1']")
• 3. 匹配有id并且值不为d1的元素
•     $("div[id!='d1']")

9  子元素选择器

• 1. 匹配div中 第n个子元素   n从1开始
•    $("div:nth-child(n)")
• 2. 匹配div中第一个子元素
•     $("div:first-child")
• 3. 匹配div中最后一个子元素
•     $("div:last-child")

10 表单选择器

• 1. 匹配所有的input元素  包括：文本框，密码框，单选，多选，下拉选，文本域，button
•         $(":input")
• 2. 匹配所有的密码框   $(":password")
• 3. 匹配单选   $(":radio")
• 4. 匹配多选     $(":checkbox")
• 5. 匹配所有被选中的 单选/多选/下拉选option     $(":checked")
• 6. 匹配所有被选中的 单选/多选     $("input:checked")
• 7. 匹配被选中的下拉选option   $(":selected")

初学jQuery 选择器 对于新手来说需要很多东西要记，以下有些选择器的题有助于加深印象

需要的可以下载，相互学习！