本文共 1791 字，大约阅读时间需要 5 分钟。
jQuery的选择器与CSS选择器非常相似，能够帮助开发者快速定位和操作DOM元素。本文将从基础到高级选项，详细介绍jQuery选择器的使用方法。
jQuery的基本选择器与CSS选择器一致，常见的有标签选择器、id选择器、类选择器等。以下是基本选择器的示例：
通过jQuery对象符号 $() 可以对元素进行操作。以下是常用的选择方式：
$('button')$('#btn').cls.cls#btn2 或 .cls, #btn此外，通配符选择器可以使用 '*' 获取所有元素。
层级选择器可以通过CSS中的层级关系来实现。在jQuery中，可以使用类似 parent() 和 child() 的方式来定位元素。
通过以下选择器可以实现层级定位：
div：$('.parent1 div')$('.parent1>div')$('#child1+div') 或 $('#child1~div')过滤选择器可以进一步细化选择条件，常见的有索引过滤、内容过滤、可见性过滤等。
:first：获取第一个元素:last：获取最后一个元素:even：获取索引为偶数的元素:odd：获取索引为奇数的元素:eq(n)：获取第n个元素（索引从0开始）:gt(k)：获取索引大于k的元素:lt(k)：获取索引小于k的元素:not()：排除匹配的元素contains()：匹配包含特定文本的元素empty()：匹配没有子元素或文本的元素parent()：匹配有子元素或文本的元素has()：匹配包含特定元素的父元素:hidden：匹配不可见的元素:visible：匹配可见的元素通过属性选择器可以对元素的属性进行筛选。例如：
选择时可以使用属性选择器：
name 属性：$('div[name]')name="d1" 属性：$('div[name=d1]')$('div[name=d1][class=cls]')对于父元素的子元素，可以使用以下选择器：
:nth-child(n)：匹配父元素下第n个子元素:first-child：匹配第一个子元素:last-child：匹配最后一个子元素:only-child：匹配唯一的子元素例如：
选择时可以使用：
div:first-childdiv:last-childdiv:nth-child(1)div:only-child对于表单元素，可以使用以下属性选择器：
:enabled：匹配可用元素:disabled：匹配不可用元素:checked：匹配选中的单选或复选按钮:selected：匹配选中的 <option> 元素例如：
选择时可以使用：
:enabled:disabled:selected:checked对于表单元素，可以使用以下表单选择器：
:input：匹配 input、textarea、select、button 元素:text：匹配单行文本框:password：匹配密码框:radio：匹配单选按钮:checkbox：匹配复选框:submit：匹配提交按钮:image：匹配图像域:reset：匹配重置按钮:button：匹配所有按钮:file：匹配文件上传域这些选择器可以帮助开发者快速定位和操作表单元素，提升用户体验。
转载地址：http://tsjv.baihongyu.com/