selector

产品配图

关于

最近一直在用 Claude Code、Codex、Cursor 这类 AI 编程助手改页面，发现一个小问题：截图很直观，但经常缺少 DOM / React 上下文；直接复制 HTML 又太长，AI 容易被无关信息带偏。 所以做了 Selector，一个很小的 bookmarklet。拖到书签栏后，在任意页面点选元素，就可以复制一段比较干净的上下文 prompt，包含页面路径、稳定 locator、可见文本、React 组件路径（如果能识别到），以及少量样式和布局信息。目标很简单：让 AI 编程助手更快理解“我要改的是这个具体元素”。 它没有做成浏览器插件，也没有账号、后端和聊天界面。只是一个很轻的工具，适合在 localhost、React / Next.js 项目或线上页面上临时使用。 我自己主要拿它辅助 Vibe coding：选中按钮、卡片、表格单元格这类 UI 后，复制给 AI，让它少猜一点上下文。项目完全开源，希望对也在用 AI coding agents 改界面的同学有帮助。

收录记录

1. 阮一峰周刊·用户投稿

   2026年6月23日 · 1 次收录