jQuery选择器全览：61种用法解析

"jQuery 选择器（61种）整理总结" jQuery选择器是jQuery库中的核心功能之一，它极大地简化了DOM元素的选择和操作。在JavaScript中，传统的DOM操作相对复杂，而jQuery通过其丰富的选择器集合，使得开发者能够更高效、更简洁地选取页面上的特定元素。以下是部分jQuery选择器的详细说明： 1. #id: 这是ID选择器，用于根据给定的ID匹配一个唯一的元素。例如，`$("#myId")`会选择ID为"myId"的元素。在示例中，第一个`<p>`标签的颜色被设置为红色。 2. element: 元素选择器基于元素的标签名，如`$("div")`会选取所有的`<div>`元素。在示例中，所有的`<div>`标签文本颜色被设为红色。 3. .class: 类选择器使用"."前缀，用于匹配具有指定CSS类的元素。例如，`$(".myClass")`会选择所有class为"myClass"的元素。在这个例子中，第一个`<p>`标签被选中并改变颜色。 4. *: 通配符选择器匹配所有元素。在提供的代码中，`$("*")`选取页面上的每一个元素并将其文本颜色设为红色。 5. 多选择器: 可以组合使用多个选择器，用逗号分隔，如`selector1, selector2, selectorN`，这会选取满足任一条件的元素。在示例中，`$(".myP", "#myDiv")`会选取class为"myP"的`<p>`元素和ID为"myDiv"的`<div>`元素。 除了以上的基本选择器，jQuery还提供了许多其他高级选择器，包括： 6. 属性选择器：如`$("[href]")`选取所有具有href属性的元素，`$("[name='foo']")`选取name属性值为"foo"的元素。 7. 位置选择器：例如，`:first`选取第一个元素，`:last`选取最后一个元素，`:even`和`:odd`分别选取索引偶数和奇数的元素。 8. 内容选择器：`:contains(text)`选取包含特定文本的元素，`:empty`选取没有子节点的元素。 9. 表单选择器：`:input`选取所有输入元素，`:checkbox`, `:radio`, `:text`, `:password`等则分别选取特定类型的表单元素。 10. 表兄弟和相邻选择器：`:next`选取紧跟在当前元素后的同级元素，`:prev`选取前一个同级元素，`:siblings`选取所有同级元素，`:parent`选取父元素。 11. 子代和后代选择器：`>`表示直接子元素选择器，如`$("ul > li")`选取`<ul>`下的直接子`<li>`，而`"+"和"`~`分别表示紧邻兄弟选择器和后续兄弟选择器。 jQuery选择器的丰富性和灵活性使得开发者可以轻松地定位到需要操作的DOM元素，进行样式修改、事件绑定等各种操作，极大地提高了开发效率。理解并熟练运用这些选择器是成为jQuery专家的基础。