jquery三大选择器
jQuery三大核心选择器
jQuery的选择器是其核心功能之一，允许开发者快速定位DOM元素。以下是三种最基础且常用的选择器类型：
基本选择器
-
ID选择器
通过HTML元素的id属性选取单个元素，语法为$("#id")。
示例：$("#header")选取id="header"的元素。 -
类选择器
通过class属性选取元素，语法为$(".class")。
示例：$(".btn")选取所有class="btn"的元素。 -
元素选择器
通过标签名选取元素，语法为$("tag")。
示例：$("div")选取所有<div>标签。
层级选择器
-
后代选择器
选取某元素内部的所有匹配后代，语法为$("ancestor descendant")。
示例：$("ul li")选取<ul>内所有<li>。 -
子元素选择器
仅选取直接子元素，语法为$("parent > child")。
示例：$("div > p")选取<div>的直接子元素<p>。
过滤选择器
-
:first与:last
选取第一个或最后一个匹配元素，如$("li:first")选取第一个<li>。 -
:even与:odd
选取偶数或奇数索引元素，如$("tr:even")选取表格偶数行。 -
:not()
排除匹配条件的元素，如$("input:not(:checked)")选取未选中的输入框。
组合使用示例
// 组合ID和类选择器
$("#container .item").css("color", "red");
// 层级与过滤结合
$("ul.list > li:first").addClass("active");这些选择器可单独或组合使用，覆盖绝大多数DOM操作需求。实际开发中，高效的选择器能显著提升性能，建议优先使用ID或原生方法（如document.getElementById()）优化速度。
