VocaGlow - 词汇高亮助手

一个 Chrome 浏览器扩展，帮助你在浏览网页时随时查词、收藏，并将已收藏的词汇在页面中自动高亮标注，让生词复习融入日常阅读。

功能特性

• 划词翻译 — 选中页面上的单词或短语（最多 3 词），立刻弹出翻译结果
• 一键收藏 — 点击收藏按钮即可将单词及释义保存到本地词汇表
• 自动高亮 — 已收藏的词汇在所有页面中自动以渐变背景高亮标注
• 悬停查看 — 鼠标悬停高亮词汇，弹出释义卡片，无需再次查询
• 发音朗读 — 内置浏览器语音合成，点击即可听取单词发音
• 词汇管理 — 在弹窗面板中查看、删除已收藏的词汇
• 滚动跟随 — 页面滚动时弹窗跟随选中位置移动，不会丢失上下文

安装方式

1. 克隆本仓库到本地

   git clone https://github.com/CodingBingo/VocaGlow.git

2. 打开 Chrome，进入 chrome://extensions/
3. 开启右上角「开发者模式」
4. 点击「加载已解压的扩展程序」，选择项目根目录
5. 扩展图标出现在工具栏，即可使用

使用方法

1. 查词 — 在任意网页上选中一个英文单词，松开鼠标后自动弹出翻译弹窗
2. 收藏 — 点击弹窗中的「收藏」按钮，词汇将被保存并高亮
3. 复习 — 收藏过的词汇会在所有页面中自动高亮显示，悬停即可查看释义
4. 管理 — 点击工具栏扩展图标，打开词汇管理面板，可查看或删除词汇

翻译来源

优先使用有道词典查询单词释义；若未找到结果，则回退到 MyMemory 翻译 API。

技术栈

• Chrome Extension Manifest V3
• 原生 JavaScript（无框架依赖）
• Chrome Storage API 本地持久化
• Web Speech API 语音合成

项目结构

VocaGlow/
├── manifest.json      # 扩展配置
├── background.js      # Service Worker，翻译 API 与数据存储
├── content.js         # 内容脚本，选词、弹窗、高亮
├── popup.html         # 弹窗面板页面
├── popup.js           # 弹窗面板逻辑
├── styles.css         # 高亮与弹窗样式
└── icons/             # 扩展图标

License

MIT