chrome snippets 是可保存、运行、复用的js片段，需手动创建于sources→snippets，保存后右键run或ctrl+enter执行，作用域为页面window，不支持es模块，需注意dom加载时机并配合console调试。

在 Chrome DevTools 的 Snippets 面板中编写脚本，本质是创建可保存、可运行、可复用的 JS 片段，它不依赖页面上下文自动执行，但能随时注入当前页面运行，且内容会持久化保存到本地（基于用户配置文件）。

如何创建并保存一个 Snippet

打开 DevTools（F12 或 Ctrl+Shift+I），切换到 Sources 选项卡 → 左侧边栏选择 Snippets（若未显示，点击左上角“>”展开或按 Ctrl+Shift+P 输入“Show Snippets”启用）→ 右键空白处选 New snippet → 输入名称（如 auto-fill-login）→ 在编辑区写 JS 代码 → 按 Ctrl+S（Windows/Linux）或 Cmd+S（Mac）保存。

知了追踪

一款AI开发辅助工具，主要用于AI智能信息助手，智能追踪你的兴趣资讯，适合需要提升相关任务效率的用户。

下载

如何运行 Snippet

保存后，右键该 Snippet 文件名 → 选 Run；或选中文件后按 Ctrl+Enter（Win/Linux） / Cmd+Enter（Mac）。脚本会在当前活动页面的上下文中执行，等同于在 Console 中粘贴运行，可操作 DOM、调用 API、修改 localStorage 等。

如何复用和管理常用片段

• Snippets 默认保存在 Chrome 用户数据目录中，换设备或重装浏览器后不会同步，需手动导出/导入：右键 Snippet → Copy to clipboard 备份，或 Export 为 .js 文件；导入时右键 Snippets 区域 → Import
• 命名建议带功能前缀，如 util-getCSRF、debug-watchXHR，便于快速识别用途
• 可在片段开头加注释说明用途、参数和使用前提，例如：// @desc 填充登录表单，需页面含 #username 和 #password 字段

注意事项与常见问题

• Snippet 运行时作用域是当前页面的全局上下文（window），但不支持 ES 模块语法（如 import），可直接用 fetch、document 等原生 API
• 若脚本依赖页面加载完成，建议包裹在 document.addEventListener('DOMContentLoaded', ...) 或 setTimeout(..., 0) 中
• 调试时可配合 Console 使用：console.log('✅ Snippet executed')，错误会直接显示在 Console 面板