jQuery系列之选择器

在jQuery中，选择器是用来选择DOM元素的一种方式。jQuery提供了丰富多样的选择器，以下是一些常用的选择器示例：

1. 基本选择器：

$('#elementId') // 选择ID为elementId的元素
$('.className') // 选择class为className的元素
$('p') // 选择所有的p元素
$('div,span,p.myClass') // 选择所有的div、span和class为myClass的p元素

2. 层级选择器：

$('parent child') // 选择父元素下的所有child元素
$('parent > child') // 选择父元素下的直接child元素
$('prev + next') // 选择紧跟在prev元素后的next元素
$('prev ~ siblings') // 选择prev元素之后的所有siblings元素

3. 过滤选择器：

$('div:first') // 选择所有div中的第一个
$('div:last') // 选择所有div中的最后一个
$('div:even') // 选择所有div中的第0、2、4...个元素（索引从0开始）
$('div:odd') // 选择所有div中的第1、3、5...个元素
$('div:eq(index)') // 选择所有div中指定索引的元素（索引从0开始）
$('div:gt(index)') // 选择所有div中索引大于指定值的元素
$('div:lt(index)') // 选择所有div中索引小于指定值的元素
$('div:header') // 选择所有标题类型的div，如h1、h2...

4. 表单选择器：

$(':input') // 选择所有input元素
$(':text') // 选择所有text input元素
$(':password') // 选择所有password input元素
$(':radio') // 选择所有radio input元素
$(':checkbox') // 选择所有checkbox input元素
$(':submit') // 选择所有submit input元素
$(':image') // 选择所有image input元素

5. 内容过滤选择器：

$('div:contains("text")') // 选择所有包含指定文本的div元素
$('div:empty') // 选择所有不包含子元素（包括文本元素）的div元素
$('div:has(selector)') // 选择所有包含特定选择器的div元素
$('div:parent') // 选择所有包含子元素（包括文本元素）的div元素

6. 属性过滤选择器：

$('div[id]') // 选择所有具有id属性的div元素
$('div[id="divId"]') // 选择id属性为divId的div元素
$('div[id!="divId"]') // 选择id属性不等于divId的div元素
$('div[id^="div"]') // 选择id属性以div开头的div元素
$('div[id$="div"]') // 选择id属性以div结尾的div元素
$('div[id*="div"]') // 选择id属性包含div的div元素
$('div[id~="div1"]') // 选择id属性包含空格分隔的值列表中的div1的div元素
$('div[id][class="myClass"]') // 选择同时具有id属性和class属性为myClass的div元素

7. 表单对象属性过滤选择器：

$(':enabled') // 选择所有可用的表单元素
$(':disabled