应使用 VS Code 全局搜索（Ctrl+Shift+F）跨文件查找 HTML5 元素，限定范围为 **/*.html，启用正则匹配语义标签，结合全字匹配与大小写敏感提升精度，并用捕获组提取 srcset 等结构特征。
如果您在编辑 HTML5 项目时需要快速定位特定结构、标签或属性，但当前文件内查找（Ctrl+F）无法覆盖多文件场景，则可能是由于搜索范围未扩展至整个工作区。以下是解决此问题的步骤：
一、使用全局搜索面板定位 HTML5 元素
VS Code 的全局搜索功能可跨所有已打开文件检索 HTML5 相关代码，支持标签名、属性、内联脚本及语义化元素（如 <header>、<section>、<article>）的精准匹配。
1、按下 Ctrl+Shift+F（Windows/Linux）或 Cmd+Shift+F（macOS） 打开全局搜索面板。
2、在搜索框中输入目标内容，例如 <main> 或 type="module"。
立即学习“前端免费学习笔记（深入）”；
3、点击搜索框右侧的 .* 按钮启用正则模式，输入 \b<(header|nav|main|article|section|aside|footer)>\b 可一次性匹配全部 HTML5 语义标签。
4、双击任意搜索结果，直接跳转至对应 HTML 文件中的具体行。
二、限定范围仅搜索 HTML5 文件
为避免在 JavaScript、CSS 或配置文件中产生干扰结果，需将搜索范围严格限制在 HTML 文件内，确保命中率与可读性。
1、在全局搜索面板的 “包含的文件”输入框 中输入 **/*.html。
2、若项目中存在 .htm 或 .xhtml 扩展名，可追加为 **/*.html,**/*.htm,**/*.xhtml。
3、确认搜索框右上角显示 “Workspace” 而非 “Open Editors”，以保证扫描完整工作区而非仅已打开文件。
三、通过文件类型图标快速筛选 HTML5 内容
VS Code 提供可视化文件类型过滤入口，无需手动输入通配符即可锁定 HTML 文件上下文，适合不熟悉 glob 语法的用户。
1、点击全局搜索面板右上角的 文件夹图标（位于放大镜右侧）。
2、在弹出菜单中选择 “HTML” 类型，此时搜索自动应用 **/*.html 过滤规则。
3、输入 data- 可快速查出所有 HTML5 自定义数据属性（如 data-id、data-role）。
四、结合全字匹配与大小写敏感提升准确性
HTML5 标签和属性对大小写不敏感，但某些自定义属性或框架约定（如 Vue 的 v-if）依赖大小写一致性，启用对应选项可避免误匹配。
1、在搜索面板顶部工具栏中，点击 Aa 图标启用“区分大小写”（适用于搜索 class 名、id 值等严格命名字段）。
2、点击 ½ 图标启用“全字匹配”，例如搜索 class 时不会匹配到 classification 或 subclass。
3、组合使用两项后，输入 async 将只匹配 script 标签中的 async 属性，而非字符串中任意出现的字母序列。
五、利用正则捕获组提取 HTML5 结构特征
当需识别具有共性但内容各异的 HTML5 片段（如所有带 srcset 的 <img>、含 crossorigin 的 <link>）时，正则捕获组可结构化提取关键字段用于分析或后续替换。
1、启用正则模式（点击 .* 按钮），输入 <img[^>]*srcset=[^>]*> 匹配所有含 srcset 属性的 img 标签。
2、输入 <link[^>]*crossorigin=[^>]*> 定位跨域资源加载声明。
3、在搜索结果面板中右键某条匹配项，选择 “复制匹配项”，粘贴至新文件进行批量审查。
