jQuery是一款流行的JavaScript库，它简化了在网页上操作HTML元素、事件处理、动画效果和Ajax等操作的过程。在使用jQuery进行开发时，熟练掌握各种选择器种类及其用途是至关重要的。选择器是jQuery中用于选取指定元素的方法，可以根据需要精准选择想要操作的元素，从而实现更加灵活的开发。
1. 基础选择器
-
元素选择器：选择所有指定元素，语法为
$("element")。例如，$("p")选取所有段落元素。$("p").css("color", "red"); -
ID选择器：选择特定id的元素，语法为
$("#id")。例如，$("#myId")选取id为"myId"的元素。$("#myId").hide(); -
类选择器：选择指定类的元素，语法为
$(".class")。例如，$(".myClass")选取类为"myClass"的元素。$(".myClass").fadeIn();
2. 层级选择器
-
后代选择器：选择指定元素的后代元素，语法为
$("parent descendant")。例如，$("div p")选取所有div元素内的段落元素。$("div p").addClass("highlight"); -
子元素选择器：选择指定元素的直接子元素，语法为
$("parent > child")。例如，$("ul > li")选取ul元素下的直接子元素li。$("ul > li").hover(function(){ $(this).toggleClass("hover"); }); ### 3. 过滤选择器 -
第一个元素：选择第一个匹配的元素，语法为
:first。例如，$("li:first")选取第一个li元素。$("li:first").css("font-weight", "bold"); -
最后一个元素：选择最后一个匹配的元素，语法为
:last。例如，$("li:last")选取最后一个li元素。$("li:last").css("color", "blue");4. 内容选择器
-
包含指定文本内容的元素：选择包含指定文本内容的元素，语法为
:contains(text)。例如，$("p:contains('Hello')")选取包含文本"Hello"的段落元素。$("p:contains('Hello')").addClass("highlight"); -
空元素：选择没有子元素的空元素，语法为
:empty。例如，$("div:empty")选取空的div元素。$("div:empty").text("This div is empty");5. 状态选择器
-
可见元素：选择可见的元素，语法为
:visible。例如，$("div:visible")选取可见的div元素。$("div:visible").fadeOut(); 隐藏元素：选择被隐藏的元素，语法为
:hidden。例如，$("div:hidden")选取被隐藏的div元素。
