1. jQuery选择器基础

jQuery选择器用于定位和操作HTML DOM元素。它们基于CSS选择器语法，但提供了更强大的功能。

• 标签选择器：如$(“p”)选取所有的<p>标签。
• 类选择器：如$(“.myClass”)选取所有具有myClass类属性的元素。
• ID选择器：如$(“#myId”)选取ID为myId的元素。

2. 层级选择器

层级选择器利用元素之间的层级关系来选取元素。

• 子元素选择器：如$(“#parent > p”)选取id为parent的直接子元素p。
• 后代选择器：如$(“#parent p”)选取id为parent的所有后代元素p。

3. 过滤选择器

过滤选择器可以基于元素的内容、可见性和属性等条件来进行选择。

• 基于内容的过滤选择器：如$(“p:contains(‘important’)”)选择包含特定文本的段落。
• 基于可见性的过滤选择器：如$(“:hidden”)选择所有不可见的元素。

4. 案例讲解：修改段落颜色

下面是一个简单的案例，展示了如何使用jQuery选择器修改页面上所有段落的颜色。

$(document).ready(function(){
    $("p").css("color", "blue");
});

在这个例子中，当文档加载完成后，所有<p>标签的文本颜色将被修改为蓝色。

5. 高级应用：组合选择器与扩展方法

选择器组合是通过使用逗号分隔各个选择器，从而选取多个匹配的元素集合。

$("div.className, span.className").css("font-weight", "bold");

这个例子中，所有具有className类的<div>和<span>元素的字体加粗。