4 基本选择器
在上一篇中，我们学习了什么是 jQuery，以及如何下载和引入 jQuery 库。现在，我们将深入研究 jQuery 的选择器，特别是“基本选择器”。选择器是 jQuery 中的重要工具，允许我们轻松选择和操作网页中的元素。
什么是选择器？
选择器是 jQuery 中的一个核心概念，它用来查找和选择 DOM 元素。通过选择器，我们可以选择特定的元素并对其进行操作，比如修改内容、样式、事件绑定等。
在 jQuery 中，选择器的功能类似于 CSS 选择器，但提供了更丰富的选择功能。
基本选择器
基本选择器是 jQuery 中最常用的选择器，它包括以下几种：
- 元素选择器：选择指定标签的元素。
- ID 选择器：选择具有特定 ID 的元素。
- 类选择器：选择具有特定类的元素。
- 通配符选择器：选择所有元素。
1. 元素选择器
元素选择器用于选择特定类型的 HTML 元素。例如，要选择所有的 <p> 标签，可以使用以下代码：
1 | $('p').css('color', 'blue'); |
上面的代码会将页面中所有的段落文字颜色设置为蓝色。
2. ID 选择器
ID 选择器用于选择具有特定 ID 的元素。因为每个 ID 在一个页面中是唯一的，所以使用 ID 可以精确地选定一个元素。语法为 #id。例如，要选择一个 ID 为 header 的元素：
1 | $('#header').fadeOut(); |
该代码会让 ID 为 header 的元素逐渐消失。
3. 类选择器
类选择器用于选择某一类的元素，语法为 .class。例如，要选择所有具有 highlight 类的元素：
1 | $('.highlight').css('background-color', 'yellow'); |
以上代码会将所有带有 highlight 类的元素的背景颜色更改为黄色。
4. 通配符选择器
通配符选择器选择所有的元素，语法为 *。例如：
1 | $('*').css('border', '1px solid black'); |
这段代码会给页面中的所有元素添加一个黑色的边框。
案例
让我们通过一个简单的示例来巩固基本选择器的使用。假设我们有以下 HTML 结构：
1 |
|
在这个示例中，我们使用了基本选择器对不同的元素进行了操作。通过这种方式，我们可以清楚地看到每种选择器的实际应用。
总结
通过本篇文章，我们了解了 jQuery 的基本选择器，包括元素选择器、ID 选择器、类选择器和通配符选择器。掌握选择器的使用是学习 jQuery 的第一步，它将为后续的学习打下坚实的基础。在下一篇中，我们将继续深入学习 jQuery 的层级选择器，帮助我们选择有层次关系的元素。请继续关注！
如果你有任何问题或需要进一步的解释，请随时提问！
