选择器
jQuery的选择器相比javaScript更简单明了。
$()是jQuery的元素选择器，各种DOM是这选择的:
$()查找元素
| 选择器语法 |
说明 |
| $(*) |
选择所有元素 |
| $(element) |
按元素名称选择 |
| $(id) |
按id选择元素 |
| $(.class) |
按类选元素 |
基本选择器
| 选择器示例 |
说明 |
| ancestor descendant |
一个元素是另一个元的后代，如li a |
| parent>chiild |
一个元素是另一个元素的子节点 |
| previous+next |
想领的兄弟选择器，只会选中紧跟在前一个元素之后的那一个 元素 |
| previous-siblings |
兄弟选择器会选择钱前一个元素的所有兄弟元素 |
基本筛选器
| 筛选示例 |
说明 |
| $('li:first') |
选取第一个元素 |
| $('li:last') |
选取最后一个元素 |
| $("tr:even") |
选取索引为偶数的元素，从 0 开始 |
| $("tr:odd") |
选取索引为奇数的元素，从 0 开始 |
| $("tr:eq(1)") |
选取给定索引值的元素 |
| $("tr:gt(0)") |
选取大于给定索引值的元素 |
| $("tr:lt(2)") |
选取小于给定索引值的元素 |
| $(":focus") |
当前获取焦点的元素 |
| $(":animated") |
正在执行动画效果的元素 |
内容选择器
| 筛选示例 |
说明 |
| $("div:contains('nick')") |
选取包含nick文本的元素 |
| $("td:empty") |
选取不包含子元素或者文本的空元素 |
| $("div:has(p)") |
选取含有选择器所匹配的元素 |
| $("td:parent") |
选取含有子元素或者文本的元素 |
可见性选择器
| 筛选示例 |
说明 |
| $("div:hidden") |
筛选所有隐藏的元素 |
| $("td:empty") |
筛选所有可见的元素 |
子节点选择器
| 筛选示例 |
说明 |
| $("ul:nth-child(2)") |
选取当前选中元素的指定子节点，参数中的值是从1开始索引的 |
| $("ul:first-child") |
选取当前选中元素的第一个子节点 |
| $("ul:last-child") |
选取当前选中元素的最后一个子节点 |
| $("ul:only-child") |
选取当前是父元素的唯一子节点时选中 |
属性筛选器
| 筛选示例 |
说明 |
| $("[href]") |
筛选指定属性的元素 |
| $(“[hret='https://www.0735it.net']”) |
筛选指定属性，并指定属性值的元素 |
| $("[href!='#index']") |
筛选指定属性，并属性值不为指定值的元素 |
| $("[href^='#']") |
筛选以特定值开头的元素 |
| $("[href*='#']") |
筛选包含特定值的元素 |
| $("[href|='#']") |
筛选属性值等于特定字符串，或以特定字符串做为前缀，后加一个连字符（-）的元素 |
| $('input[name~="man"]') |
筛选属性值以空格分隔的多个值中的一个 |
| $('input[id][name$="man"]') |
多个属性筛选器同时使用 |
表单筛选器
| 筛选示例 |
说明 |
| $("input") |
筛选所有的input元素 |
| $("input:text") |
筛选所有文本类型的input元素 |
| $("input:password") |
筛选所有密码类型的input元素 |
| $("input:radio") |
筛选所有单选类型的input元素 |
| $("input:checkbox") |
筛选所有复选类型的input元素 |
| $("input:submit") |
筛选所有的提交按钮 |
| $("input:image") |
筛选所有的图片 |
| $("input:reset") |
筛选所有的重置按钮 |
| $("input：button") |
筛选所有的按钮 |
| $("input:file") |
筛选所有的文件上传域 |
| $("input:selected") |
筛选所有的提交按钮 |
| $("input:enabled") |
筛选所有可用的元素 |
| $("input:disabled") |
筛选所有禁用的元素 |
| $("input:checked") |
筛选所被选中的单选或筛选元素 |