【程序员入门系列】jQuery 零基础入门到精通！Jquery 选择器 API
一、参考资料
【【程序员入门系列】jQuery零基础入门到精通！（26集完整版）】 https://www.bilibili.com/video/BV1NwigBbE8W/?p=3\&share_source=copy_web\&vd_source=855891859b2dc554eace9de3f28b4528
二、AI 笔记总结
三、AI 笔记总结
整理一个表格，关于 jQuery 的基本选择器、基本过滤选择器、子元素过滤选择器、属性过滤选择器、内容过滤选择器、可见性过滤选择器、表单元素属性过滤选择器，表格要有三列，一列是选择器，一列是说明，一列是用法举例。
| 选择器 | 说明 | 用法举例 |
|---|---|---|
* |
选择所有元素 | $('*') 选择页面上所有元素 |
#id |
选择具有指定 ID 的元素 | $('#myId') 选择 ID 为 myId 的元素 |
.class |
选择具有指定类名的所有元素 | $('.myClass') 选择所有类名为 myClass 的元素 |
element |
选择指定标签名的所有元素 | $('p') 选择所有 <p> 元素 |
selector1, selector2, ... |
选择匹配任一选择器的元素（并集） | $('div, span, .highlight') 选择所有 div、span 和类名为 highlight 的元素 |
:first |
选择第一个匹配的元素 | $('p:first') 选择第一个 <p> 元素 |
:last |
选择最后一个匹配的元素 | $('p:last') 选择最后一个 <p> 元素 |
:even |
选择索引为偶数的元素（从 0 开始） | $('tr:even') 选择表格中索引为 0、2、4... 的行 |
:odd |
选择索引为奇数的元素（从 0 开始） | $('tr:odd') 选择表格中索引为 1、3、5... 的行 |
:eq(index) |
选择指定索引位置的元素（从 0 开始） | $('li:eq(2)') 选择第三个 <li> 元素（索引为 2） |
:gt(index) |
选择索引大于指定值的元素 | $('li:gt(2)') 选择索引大于 2 的所有 <li> 元素 |
:lt(index) |
选择索引小于指定值的元素 | $('li:lt(2)') 选择前两个 <li> 元素（索引为 0 和 1） |
:not(selector) |
选择不匹配指定选择器的元素 | $('input:not(:disabled)') 选择所有未被禁用的输入框 |
:header |
选择所有标题元素（h1 至 h6） | $(':header') 选择所有 <h1> 到 <h6> 元素 |
:animated |
选择正在执行动画的元素 | $(':animated') 选择当前正在执行动画的元素 |
:first-child |
选择作为其父元素的第一个子元素的所有元素 | $('li:first-child') 选择每个父元素下的第一个 <li> 子元素 |
:last-child |
选择作为其父元素的最后一个子元素的所有元素 | $('li:last-child') 选择每个父元素下的最后一个 <li> 子元素 |
:nth-child(n) |
选择作为其父元素的第 n 个子元素的所有元素 | $('tr:nth-child(2)') 选择每个父级下的第二个 <tr> 子元素 |
:nth-child(even) |
选择作为其父元素的偶数位置子元素 | $('tr:nth-child(even)') 选择表格中偶数位置的行 |
:nth-child(odd) |
选择作为其父元素的奇数位置子元素 | $('tr:nth-child(odd)') 选择表格中奇数位置的行 |
:only-child |
选择其父元素下唯一的子元素 | $('li:only-child') 选择父元素中只有一个子元素且为 <li> 的项 |
[attribute] |
选择具有指定属性的元素 | $('[href]') 选择所有具有 href 属性的元素 |
[attribute=value] |
选择指定属性等于指定值的元素 | $('a[href="https://example.com"]') 选择链接指向 https://example.com 的 <a> 元素 |
[attribute!=value] |
选择指定属性不等于指定值的元素 | $('input[type!=text]') 选择所有 type 不是 text 的输入框 |
[attribute^=value] |
选择指定属性值以指定字符串开头的元素 | $('a[href^="https"]') 选择所有以 https 开头的链接 |
[attribute$=value] |
选择指定属性值以指定字符串结尾的元素 | $('img[src$=".png"]') 选择所有以 .png 结尾的图片 |
[attribute*=value] |
选择指定属性值包含指定字符串的元素 | $('div[class*="menu"]') 选择 class 中包含 menu 的所有 div 元素 |
[attr竖线=value] |
选择指定属性值等于指定值或以该值开头并后跟连字符的元素 | $('[lang竖线=en]') 选择 lang="en" 或 lang="en-US" 的元素 |
[attr~=value] |
选择指定属性值包含指定单词（以空格分隔）的元素 | $('div[class~="highlight"]') 选择 class 中包含独立单词 highlight 的元素 |
:contains(text) |
选择包含指定文本的元素 | $('p:contains("Hello")') 选择包含文本 "Hello" 的 <p> 元素 |
:empty |
选择没有子元素（包括文本内容）的元素 | $('div:empty') 选择所有为空的 <div> 元素 |
:has(selector) |
选择包含至少一个匹配指定选择器的子元素的元素 | $('div:has(p)') 选择包含 <p> 元素的所有 <div> |
:parent |
选择至少包含一个子元素（包括文本）的元素 | $('div:parent') 选择所有非空的 <div> 元素 |
:hidden |
选择所有隐藏的元素（样式为 display: none、type=hidden 元素、宽高为 0 等） | $(':hidden') 选择所有当前隐藏的元素 |
:visible |
选择所有可见的元素 | $(':visible') 选择所有当前可见的元素 |
:enabled |
选择所有启用状态的表单元素 | $('input:enabled') 选择所有启用的输入框 |
:disabled |
选择所有禁用状态的表单元素 | $('input:disabled') 选择所有被禁用的输入框 |
:checked |
选择所有被选中的 checkbox、radio 元素 | $('input:checked') 选择所有被选中的单选框或多选框 |
:selected |
选择所有被选中的 option 元素 | $('option:selected') 选择下拉框中当前被选中的选项 |