jQuery中常见的选择器有哪些？详解

jQuery是一种快速、简洁且功能丰富的JavaScript库，它提供了丰富的选择器，可以让开发者快速定位和操作HTML元素。jQuery中常见的选择器有：

1、基本选择器

$("*") // 选择所有元素
$(this) // 选择当前元素
$("p.intro") // 选择所有class="intro"的p元素
$("p:first") // 选择第一个p元素
$("ul li:first") // 选择第一个ul元素的第一个li元素

2、层次选择器

$("div p") // 选择div元素内部的所有p元素
$("div > p") // 选择div元素内部的直接子元素p元素
$("div + p") // 选择div元素紧接的后面的p元素
$("div ~ p") // 选择div元素之后的所有同辈元素p元素

3、过滤选择器

$("div:first") // 选择div的第一个元素
$("div:last") // 选择div的一个元素
$("div:even") // 选择div的偶数元素
$("div:odd") // 选择div的奇数元素
$("div:eq(2)") // 选择div的第三个元素
$("div:gt(2)") // 选择div的第三个以后的元素
$("div:lt(2)") // 选择div的第三个以前的元素
$("div:header") // 选择div中所有标题元素
$("div:animated") // 选择div中正在执行动画的元素
$("div:contains('hello')") // 选择div中包含文本hello的元素
$("div:empty") // 选择div中不包含子元素的元素

4、属性选择器

$("[name]") // 选择所有有name属性的元素
$("[name='username']") // 选择所有name属性等于username的元素
$("[name!='username']") // 选择所有name属性不等于username的元素
$("[name$='man']") // 选择所有name属性以man结尾的元素
$("[name^='wo']") // 选择所有name属性以wo开头的元素
$("[name*='llo']") // 选择所有name属性中包含llo的元素
$("[data-log]") // 选择所有有data-log属性的元素

5、伪类选择器

$(":button") // 选择所有type="button"的input元素
$(":checkbox") // 选择所有type="checkbox"的input元素
$(":checked") // 选择所有选中的input元素
$(":disabled") // 选择所有disabled属性的input元素
$(":enabled") // 选择所有enabled属性的input元素
$(":focus") // 选择当前获得焦点的input元素
$(":image") // 选择所有type="image"的input元素
$(":input") // 选择所有input、textarea、select和button元素
$(":password") // 选择所有type="password"的input元素
$(":reset") // 选择所有type="reset"的input元素
$(":selected") // 选择所有选中的option元素
$(":submit") // 选择所有type="submit"的input元素
$(":text") // 选择所有type="text"的input元素

6、子元素选择器

$("ul li") // 选择ul元素内部的所有li元素
$("ul > li") // 选择ul元素内部的直接子元素li元素
$("ul + li") // 选择ul元素紧接的后面的li元素
$("ul ~ li") // 选择ul元素之后的所有同辈元素li元素

7、表单元素选择器

$(":input") // 选择所有input、textarea、select和button元素
$(":text") // 选择所有type="text"的input元素
$(":password") // 选择所有type="password"的input元素
$(":radio") // 选择所有type="radio"的input元素
$(":checkbox") // 选择所有type="checkbox"的input元素
$(":submit") // 选择所有type="submit"的input元素
$(":image") // 选择所有type="image"的input元素
$(":reset") // 选择所有type="reset"的input元素
$(":button") // 选择所有type="