querySelector返回第一个匹配的元素节点，支持标准CSS选择器（含伪类），不支持伪元素；可限定作用域提升精准性与性能；区别于querySelectorAll（后者返回NodeList）。
querySelector 用 CSS 选择器从文档中查找**第一个匹配的元素节点**，返回单个 Element 对象（没找到则返回 null）。它不支持伪元素（如 ::before），但支持所有标准 CSS 选择器语法，包括类名、ID、属性、组合器和伪类（如 :nth-child、:checked）。
基础写法与常见选择器示例
调用方式统一为：document.querySelector("选择器字符串") 或在某个元素上调用：element.querySelector("选择器字符串")（限制在该元素后代内查找）。
-
ID 定位：
document.querySelector("#header")—— 找到 id="header" 的元素 -
类名定位：
document.querySelector(".btn-primary")—— 找到第一个带该 class 的元素 -
标签+属性组合：
document.querySelector('input[type="email"]')—— 精准锁定 type 为 email 的 input -
后代+伪类：
document.querySelector("ul li:nth-child(2) a")—— 找到第二个列表项里的链接 -
多条件并列（逗号分隔）：
document.querySelector("button, .submit, [data-action='save']")—— 返回最先出现的匹配项（顺序优先）
注意作用域与嵌套查找
如果已有一个父元素（比如通过其他方式获取到的容器），直接在其上调用 querySelector 可缩小范围、提升性能、避免全局干扰。
java-api-doc-generator
下载
分析 Java Spring Boot 后端 Controller 代码，自动生成 Markdown 格式的接口文档。当用户说“生成 Java 接口文档”、“生成 API 文档”、“从 Spring 代码生成文档”时触发。
- 错误做法（全局查，可能误中）：
document.querySelector(".price")—— 整页找第一个 .price - 推荐做法（限定上下文）：
productCard.querySelector(".price")—— 只在某个商品卡片内部找价格元素
精准性关键：避免模糊匹配
很多“找不到”或“选错”的问题，源于选择器本身不够唯一或未考虑结构变化。建议：
- 优先用 ID（页面唯一）或带命名空间的 class（如
.user-profile__avatar） - 慎用纯标签名（如
"div"）或无上下文的类名（如".item"），容易匹配到意料之外的节点 - 利用属性选择器强化语义：
button[data-testid="submit-btn"]比单纯".btn"更可靠（尤其测试场景） - 用浏览器开发者工具的
$0.querySelector("...")实时验证选择器是否命中目标
和 querySelectorAll 的区别要点
别混淆两者：querySelector 只返回一个节点（第一个匹配项），querySelectorAll 返回 NodeList（即使只有一个匹配，也是类数组）。
- 要操作单个按钮？用
querySelector - 要遍历所有复选框？必须用
querySelectorAll+forEach - 想确认是否真有匹配？检查返回值是否为
null：if (el !== null) { ... }
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
