1. 项目概述为什么你需要一个浏览器脚本管理器如果你经常在网上冲浪可能会遇到一些让你觉得“要是能这样就好了”的时刻。比如某个视频网站没有倍速播放按钮或者一个购物网站的商品价格对比起来太麻烦又或者某个论坛的页面设计让你眼花缭乱。这些时候一个强大的浏览器脚本管理器就是你解决问题的瑞士军刀。它不是一个独立的软件而是一个浏览器扩展允许你安装和运行由社区开发者编写的、能够修改网页外观和功能的JavaScript脚本。简单来说脚本管理器就像是一个“超级插件平台”。我们常说的“油猴”Tampermonkey和“暴力猴”Violentmonkey就是其中最流行的两个。它们本身不提供具体功能但为你提供了一个安全、便捷的运行环境让你可以从Greasy Fork等脚本仓库中一键安装成千上万的用户脚本从而实现对特定网站的个性化增强。无论是去除烦人的广告、自动完成表单、下载媒体资源还是整合页面信息脚本都能做到。今天我们就从零开始手把手教你安装脚本管理器并创建你的第一个脚本打开浏览器自定义世界的大门。2. 脚本管理器选型油猴 vs. 暴力猴 vs. 其他在开始安装之前我们先花点时间了解一下主流的选择。这不仅仅是选一个图标而是选择一套不同的管理哲学和功能集。2.1 油猴生态之王与老牌劲旅Tampermonkey因其猴子图标被国内用户亲切地称为“油猴”无疑是这个领域的绝对霸主。它的优势非常明显庞大的用户基数和生态绝大多数脚本开发者会优先确保其脚本在油猴上的兼容性。你在Greasy Fork上看到的脚本几乎都明确标注支持Tampermonkey。功能全面且稳定提供了最丰富的配置选项包括脚本的定时运行、订阅更新、云同步高级功能、详细的权限控制和调试工具。它的设置面板逻辑清晰对于有经验的用户来说可控性极强。良好的开发者支持内置的编辑器功能相对完善错误提示和日志查看都比较方便。当然它也有一些争议点。油猴提供了免费版本和付费的“测试版”。免费版功能已经非常强大完全够用付费版主要提供云同步等增值服务。有些用户对其部分高级功能收费有微词但这并不影响其免费核心功能的完整性。适合人群绝大多数用户尤其是希望获得最广泛脚本兼容性和最稳定体验的用户。2.2 暴力猴开源轻量的后起之秀Violentmonkey即“暴力猴”是作为油猴的一个开源替代品出现的。它的核心特点是完全免费与开源所有功能免费代码公开透明这对于注重隐私和软件自由度的用户来说很有吸引力。界面简洁易于上手它的设置界面比油猴更清爽对于新手来说可能更友好基本功能一目了然。轻量快速由于功能相对油猴精简一些在理论上有更快的启动和运行速度实际感知可能不明显。它的主要劣势在于生态。虽然它兼容大部分为油猴编写的脚本因为它们都遵循相同的用户脚本API标准但仍有极少数脚本可能使用了油猴特有的API在暴力猴上无法运行。不过这种情况正在随着暴力猴的普及而减少。适合人群偏好开源软件、追求简洁、对云同步等高级功能无需求的用户。2.3 其他选择与总结除了这两者还有像Greasemonkey火狐浏览器上最早的元老等选择但用户量和活跃度已远不如前两者。对于绝大多数中国用户尤其是Chrome、Edge、360等Chromium内核浏览器的用户在油猴和暴力猴之间二选一即可。我的选择建议如果你是第一次接触我强烈推荐从油猴开始。更庞大的生态意味着你在寻找脚本时几乎不会遇到兼容性问题能获得最“即装即用”的体验。等你对脚本运行机制熟悉后如果对开源有执念再尝试暴力猴也不迟。为了教程的普适性后续的安装演示将以Tampermonkey油猴在Microsoft Edge浏览器Chromium内核与Chrome操作几乎一致上的安装为例其他浏览器和暴力猴的安装流程大同小异。3. 详细安装步骤与避坑指南安装浏览器扩展听起来简单但在国内网络环境下有时也会遇到一些小波折。我会把每一步都拆解清楚并告诉你可能遇到的问题。3.1 通过浏览器官方商店安装推荐首选这是最安全、最方便的方式扩展会自动更新。打开浏览器扩展商店Microsoft Edge点击浏览器右上角的“...”菜单 - “扩展” - 在左侧点击“打开Microsoft Edge加载项网站”。Google Chrome点击右上角三个点 - “更多工具” - “扩展程序” - 在页面左上角点击“打开Chrome网上应用店”。Firefox点击右上角菜单按钮 - “附加组件” - 在左侧选择“扩展”。搜索并安装在商店的搜索框中输入“Tampermonkey”或“Violentmonkey”。在搜索结果中认准官方标识通常有“特色”或“验证”标记。务必核对开发者名称Tampermonkey的开发者是“Tampermonkey.net”Violentmonkey的开发者是“暴力猴”。点击“获取”或“添加到Chrome/Edge”按钮在弹出的确认对话框中点击“添加扩展程序”。确认安装成功安装完成后你会在浏览器工具栏地址栏右侧看到一个猴子的图标。点击它如果出现油猴的管理菜单就说明安装成功了。注意由于网络原因部分用户可能无法直接访问Chrome网上应用店。此时可以尝试使用Edge商店通常可访问或者采用下面的方法二。3.2 通过CRX文件手动安装备选方案如果官方商店无法访问我们可以从可靠的第三方网站下载扩展的.crx文件或.zip压缩包进行手动安装。寻找可靠来源访问如“极简插件”等信誉较好的第三方Chrome扩展下载站。搜索“Tampermonkey”下载其最新版本的.crx文件。浏览器进入开发者模式在浏览器地址栏输入edge://extensions/或chrome://extensions/打开扩展管理页面。打开右上角的“开发者模式”开关。拖拽安装将下载好的.crx文件直接拖拽到扩展管理页面中。浏览器会提示“拖放以安装”松开鼠标确认添加即可。处理.zip文件如果下载的是.zip压缩包需要先将其解压到一个单独的文件夹中。然后在扩展管理页面点击“加载已解压的扩展程序”选择刚才解压出来的那个文件夹。重要警告手动安装方式需要你自行承担安全风险。务必从可信的网站下载文件因为恶意扩展可以窃取你的所有浏览器数据。安装后留意扩展的权限请求定期检查更新。3.3 安装后的初步设置与验证安装完成后别急着关掉页面我们先做两件小事固定图标新安装的扩展图标可能会隐藏在扩展菜单里。点击浏览器工具栏的“拼图”或“扩展”图标找到油猴点击其旁边的“图钉”图标将其固定在工具栏上方便后续使用。验证运行状态访问一个知名脚本网站如 Greasy Fork 如果你看到脚本安装按钮是绿色且显示“安装此脚本”而不是叫你安装油猴就说明脚本管理器已经在正常运行了。4. 创建你的第一个用户脚本从“Hello World”开始脚本管理器装好了我们现在来创建一个属于自己的脚本。虽然一开始什么功能都没有但这个过程能让你理解脚本是如何被创建、编辑和管理的。4.1 打开脚本管理面板与创建新脚本点击工具栏上的油猴图标在下拉菜单中选择“仪表盘”。这是管理所有脚本的控制中心。在仪表盘界面切换到“实用工具”选项卡。在“新建用户脚本”区域点击“文件”选项卡旁边的“新建”按钮一个“”号图标。点击后油猴会为你打开一个新的标签页里面是一个预设好基本框架的脚本编辑器。这就是你的第一个脚本的“出生地”。4.2 解读脚本的“元数据”头部脚本编辑器打开后你会看到一大段被/* UserScript和/UserScript包裹的注释。这部分至关重要它定义了脚本的基本信息、运行规则和权限千万不要删除。我们来逐一解读关键字段// UserScript // name 我的第一个脚本 // namespace http://tampermonkey.net/ // version 0.1 // description 这是一个示例脚本用于学习 // author You // match https://www.example.com/* // grant none // /UserScriptname: 脚本的名称会显示在油猴的脚本列表里。把它改成“网页标题修改器”之类有意义的名称。namespace: 命名空间可以理解为脚本作者的标识通常用你的网站或GitHub地址防止与其他脚本冲突。可以先保留默认或改成你的名字缩写。version: 脚本版本号。每次你修改并更新脚本后应该递增这个版本号如0.1 - 0.2这样油猴才能正确提示更新。description: 脚本描述简单说明这个脚本是干什么的。match:这是核心中的核心。它定义了脚本在哪些网址上会自动运行。支持通配符*。https://www.example.com/*表示在example.com这个域名下的所有页面运行。https://*.baidu.com/*表示在baidu.com的所有子域名下的所有页面运行。你可以同时有多个match行。现在我们把它改成https://www.baidu.com/让我们的脚本只在百度首页生效。grant: 声明脚本需要使用的特殊油猴API权限。none表示不需要任何特殊权限。如果你后续需要操作浏览器存储、发起网络请求等就需要在这里声明如grant GM_setValue。4.3 编写第一个功能修改网页标题在元数据头部下方就是编写JavaScript代码的地方。我们来写一个简单但立刻能看到效果的功能修改百度首页的标题。将编辑器中的代码替换为以下内容// UserScript // name 百度标题修改器 // namespace https://your-namespace.example.com // version 0.1 // description 尝试修改百度首页的标题 // author YourName // match https://www.baidu.com/ // grant none // /UserScript (function() { use strict; // 你的代码写在这里 console.log(我的脚本开始运行了); // 在控制台输出日志用于调试 // 修改网页标题 document.title 【脚本测试】 document.title; // 我们也可以尝试在页面顶部添加一个红色的提示框 let noticeDiv document.createElement(div); noticeDiv.innerHTML strong提示/strong 这个页面正在被我的用户脚本修改; noticeDiv.style.cssText background-color: #ffebee; border: 2px solid #ef5350; padding: 10px; margin: 10px; border-radius: 5px; text-align: center;; document.body.insertBefore(noticeDiv, document.body.firstChild); })();代码解释(function() { ... })();这是一个立即执行函数表达式将我们的代码包裹起来形成一个独立的作用域避免污染网页原有的全局变量这是一个最佳实践。use strict;启用严格模式帮助我们发现一些潜在的编码错误。console.log(...)在浏览器的开发者工具控制台输出信息是调试脚本的必备手段。document.title ...直接修改网页的标题即浏览器标签页上显示的文字。后面几行代码创建了一个新的div元素设置它的内容和样式红色边框、浅红背景然后把它插入到网页正文的最前面。4.4 保存、启用与测试脚本保存脚本在脚本编辑器页面按Ctrl S(Windows) 或Cmd S(Mac) 保存。油猴会自动保存并关闭编辑器标签页。启用脚本回到油猴的“仪表盘”在“已安装脚本”列表里你应该能看到刚刚创建的“百度标题修改器”。确保其右侧的开关是**开启绿色**状态。测试效果打开一个新的浏览器标签页访问https://www.baidu.com。观察浏览器标签页标题应该变成了“【脚本测试】百度一下你就知道”。同时页面最顶部应该出现了一个红色的提示框。按下F12打开开发者工具切换到“Console”控制台标签页你应该能看到输出的“我的脚本开始运行了”这条日志。恭喜你已经成功创建并运行了第一个用户脚本。虽然功能简单但你已经走完了从安装环境到编写代码的完整流程。5. 脚本管理、调试与安全须知脚本运行起来了但要想玩得转还得掌握管理和调试的技巧同时必须树立安全意识。5.1 脚本的日常管理在油猴仪表盘的“已安装脚本”列表里你可以对每个脚本进行精细化管理启用/禁用点击滑块开关。临时不需要某个脚本时禁用它而不是删除。编辑点击脚本名称下方的“编辑”按钮可以重新打开脚本编辑器进行修改。设置齿轮图标可以配置脚本的运行时机如“页面加载完成后”、指定排除的网址、设置自动更新等。删除移除不再需要的脚本。搜索与排序当安装的脚本多起来后利用顶部的搜索框和表头排序功能可以快速定位。5.2 开发者工具调试技巧浏览器自带的开发者工具是脚本调试的利器。打开控制台F12- “Console”。这里会显示脚本中console.log、console.error的输出以及运行时的错误信息。调试时多打日志是定位问题的好习惯。查看脚本运行上下文F12- “Sources”。在左侧文件树中找到“Tampermonkey”或“Violentmonkey”目录展开后就能看到你正在运行的脚本文件。你可以在这里直接设置断点、单步调试就像调试普通网页JS一样。检查元素与样式F12- “Elements”。你可以查看脚本动态添加或修改的DOM元素并实时调整CSS样式来测试效果。5.3 至关重要的安全与隐私守则用户脚本能力强大但也意味着风险。请务必遵守以下原则来源可信只从Greasy Fork、OpenUserJS等知名、有审核机制的脚本平台安装脚本。避免使用来路不明的.user.js文件链接。审查权限在安装脚本前油猴会弹出权限请求告知你脚本将访问哪些网站、拥有哪些能力如读取剪贴板、访问跨域数据等。仔细阅读这些权限如果某个脚本请求的权限与其描述的功能明显不符请果断取消安装。关注作者与更新优先选择活跃、信誉好的作者发布的脚本。关注脚本的更新日志及时更新以修复可能的安全漏洞。最小化安装不要因为好奇就安装大量不用的脚本。每个脚本都会增加页面加载负担和潜在的安全风险。只安装你真正需要且信任的。谨慎对待“破解”类脚本任何声称可以免费获取付费内容、绕过网站限制的脚本都需要极度警惕。它们很可能包含恶意代码窃取你的账号密码或加密货币私钥。6. 常见问题与故障排除实录在实际使用中你肯定会遇到一些问题。这里我整理了几个最常见的情况和解决方法。6.1 脚本安装失败或无法运行问题现象可能原因解决方案点击“安装”按钮无反应脚本管理器未正确安装或启用1. 检查浏览器工具栏是否有油猴/暴力猴图标且未变灰。2. 访问edge://extensions/确认扩展已启用。3. 尝试重启浏览器。安装时提示“脚本损坏”脚本文件下载不完整或平台不兼容1. 刷新Greasy Fork页面重试。2. 检查脚本是否支持你使用的脚本管理器通常都支持。脚本已启用但页面无效果1.match或include规则不匹配当前网址。2. 脚本有Bug导致运行出错。3. 与其他脚本或浏览器扩展冲突。1. 检查脚本的元信息确认当前网址是否匹配规则。2. 打开浏览器控制台(F12-Console)查看是否有红色错误信息。3. 禁用其他脚本或扩展进行排查。6.2 脚本导致网页布局错乱或功能异常这通常是因为脚本操作的DOM元素在网站更新后发生了变化或者脚本的CSS样式与网站原有样式冲突。排查步骤禁用脚本首先在油猴面板中禁用该脚本刷新页面确认问题是否消失。如果消失基本确定是该脚本导致。检查元素使用开发者工具的“检查”功能找到布局错乱的元素查看其样式和HTML结构看是否是脚本添加或修改了不该动的内容。查看脚本代码如果是你自己写的脚本检查选择器是否过于宽泛如document.querySelector(div)可能选中了无数个div。尽量使用更精确的ID、类名或路径选择器。调整运行时机在油猴的脚本设置中将“运行时机”从“文档开始”改为“文档结束”即页面加载完成后。有时脚本跑得太快页面元素还没加载完就去操作就会出错。6.3 脚本更新失败或提示冲突更新失败可能是网络问题可以尝试手动从脚本发布页面重新安装一次覆盖安装。版本冲突如果你从不同来源安装了同名脚本油猴会提示。你需要决定保留哪一个删除另一个。永远以官方或可信源为准。6.4 性能问题脚本让浏览器变卡安装了大量脚本尤其是那些在每一个页面都会运行检查的脚本确实会影响浏览器性能。优化建议定期清理禁用或删除长期不用的脚本。细化匹配规则检查脚本的match规则确保它只在必要的网站上运行而不是*://*/*所有网站。注意脚本设计如果是自己写脚本避免使用setInterval进行高频DOM查询或操作优化代码逻辑。从安装脚本管理器到写出第一行能运行的代码你已经掌握了赋予浏览器超能力的基础。脚本的世界浩瀚如海从简单的样式调整到复杂的自动化工具几乎无所不能。关键在于保持探索和安全意识。下次我们可以深入聊聊如何分析网页结构、编写更实用的脚本比如自动展开评论区、批量处理页面信息等。记住多看看别人写的优秀脚本源码是学习最快的方式。
1. 项目概述为什么你需要一个浏览器脚本管理器如果你经常在网上冲浪可能会遇到一些让你觉得“要是能这样就好了”的时刻。比如某个视频网站没有倍速播放按钮或者一个购物网站的商品价格对比起来太麻烦又或者某个论坛的页面设计让你眼花缭乱。这些时候一个强大的浏览器脚本管理器就是你解决问题的瑞士军刀。它不是一个独立的软件而是一个浏览器扩展允许你安装和运行由社区开发者编写的、能够修改网页外观和功能的JavaScript脚本。简单来说脚本管理器就像是一个“超级插件平台”。我们常说的“油猴”Tampermonkey和“暴力猴”Violentmonkey就是其中最流行的两个。它们本身不提供具体功能但为你提供了一个安全、便捷的运行环境让你可以从Greasy Fork等脚本仓库中一键安装成千上万的用户脚本从而实现对特定网站的个性化增强。无论是去除烦人的广告、自动完成表单、下载媒体资源还是整合页面信息脚本都能做到。今天我们就从零开始手把手教你安装脚本管理器并创建你的第一个脚本打开浏览器自定义世界的大门。2. 脚本管理器选型油猴 vs. 暴力猴 vs. 其他在开始安装之前我们先花点时间了解一下主流的选择。这不仅仅是选一个图标而是选择一套不同的管理哲学和功能集。2.1 油猴生态之王与老牌劲旅Tampermonkey因其猴子图标被国内用户亲切地称为“油猴”无疑是这个领域的绝对霸主。它的优势非常明显庞大的用户基数和生态绝大多数脚本开发者会优先确保其脚本在油猴上的兼容性。你在Greasy Fork上看到的脚本几乎都明确标注支持Tampermonkey。功能全面且稳定提供了最丰富的配置选项包括脚本的定时运行、订阅更新、云同步高级功能、详细的权限控制和调试工具。它的设置面板逻辑清晰对于有经验的用户来说可控性极强。良好的开发者支持内置的编辑器功能相对完善错误提示和日志查看都比较方便。当然它也有一些争议点。油猴提供了免费版本和付费的“测试版”。免费版功能已经非常强大完全够用付费版主要提供云同步等增值服务。有些用户对其部分高级功能收费有微词但这并不影响其免费核心功能的完整性。适合人群绝大多数用户尤其是希望获得最广泛脚本兼容性和最稳定体验的用户。2.2 暴力猴开源轻量的后起之秀Violentmonkey即“暴力猴”是作为油猴的一个开源替代品出现的。它的核心特点是完全免费与开源所有功能免费代码公开透明这对于注重隐私和软件自由度的用户来说很有吸引力。界面简洁易于上手它的设置界面比油猴更清爽对于新手来说可能更友好基本功能一目了然。轻量快速由于功能相对油猴精简一些在理论上有更快的启动和运行速度实际感知可能不明显。它的主要劣势在于生态。虽然它兼容大部分为油猴编写的脚本因为它们都遵循相同的用户脚本API标准但仍有极少数脚本可能使用了油猴特有的API在暴力猴上无法运行。不过这种情况正在随着暴力猴的普及而减少。适合人群偏好开源软件、追求简洁、对云同步等高级功能无需求的用户。2.3 其他选择与总结除了这两者还有像Greasemonkey火狐浏览器上最早的元老等选择但用户量和活跃度已远不如前两者。对于绝大多数中国用户尤其是Chrome、Edge、360等Chromium内核浏览器的用户在油猴和暴力猴之间二选一即可。我的选择建议如果你是第一次接触我强烈推荐从油猴开始。更庞大的生态意味着你在寻找脚本时几乎不会遇到兼容性问题能获得最“即装即用”的体验。等你对脚本运行机制熟悉后如果对开源有执念再尝试暴力猴也不迟。为了教程的普适性后续的安装演示将以Tampermonkey油猴在Microsoft Edge浏览器Chromium内核与Chrome操作几乎一致上的安装为例其他浏览器和暴力猴的安装流程大同小异。3. 详细安装步骤与避坑指南安装浏览器扩展听起来简单但在国内网络环境下有时也会遇到一些小波折。我会把每一步都拆解清楚并告诉你可能遇到的问题。3.1 通过浏览器官方商店安装推荐首选这是最安全、最方便的方式扩展会自动更新。打开浏览器扩展商店Microsoft Edge点击浏览器右上角的“...”菜单 - “扩展” - 在左侧点击“打开Microsoft Edge加载项网站”。Google Chrome点击右上角三个点 - “更多工具” - “扩展程序” - 在页面左上角点击“打开Chrome网上应用店”。Firefox点击右上角菜单按钮 - “附加组件” - 在左侧选择“扩展”。搜索并安装在商店的搜索框中输入“Tampermonkey”或“Violentmonkey”。在搜索结果中认准官方标识通常有“特色”或“验证”标记。务必核对开发者名称Tampermonkey的开发者是“Tampermonkey.net”Violentmonkey的开发者是“暴力猴”。点击“获取”或“添加到Chrome/Edge”按钮在弹出的确认对话框中点击“添加扩展程序”。确认安装成功安装完成后你会在浏览器工具栏地址栏右侧看到一个猴子的图标。点击它如果出现油猴的管理菜单就说明安装成功了。注意由于网络原因部分用户可能无法直接访问Chrome网上应用店。此时可以尝试使用Edge商店通常可访问或者采用下面的方法二。3.2 通过CRX文件手动安装备选方案如果官方商店无法访问我们可以从可靠的第三方网站下载扩展的.crx文件或.zip压缩包进行手动安装。寻找可靠来源访问如“极简插件”等信誉较好的第三方Chrome扩展下载站。搜索“Tampermonkey”下载其最新版本的.crx文件。浏览器进入开发者模式在浏览器地址栏输入edge://extensions/或chrome://extensions/打开扩展管理页面。打开右上角的“开发者模式”开关。拖拽安装将下载好的.crx文件直接拖拽到扩展管理页面中。浏览器会提示“拖放以安装”松开鼠标确认添加即可。处理.zip文件如果下载的是.zip压缩包需要先将其解压到一个单独的文件夹中。然后在扩展管理页面点击“加载已解压的扩展程序”选择刚才解压出来的那个文件夹。重要警告手动安装方式需要你自行承担安全风险。务必从可信的网站下载文件因为恶意扩展可以窃取你的所有浏览器数据。安装后留意扩展的权限请求定期检查更新。3.3 安装后的初步设置与验证安装完成后别急着关掉页面我们先做两件小事固定图标新安装的扩展图标可能会隐藏在扩展菜单里。点击浏览器工具栏的“拼图”或“扩展”图标找到油猴点击其旁边的“图钉”图标将其固定在工具栏上方便后续使用。验证运行状态访问一个知名脚本网站如 Greasy Fork 如果你看到脚本安装按钮是绿色且显示“安装此脚本”而不是叫你安装油猴就说明脚本管理器已经在正常运行了。4. 创建你的第一个用户脚本从“Hello World”开始脚本管理器装好了我们现在来创建一个属于自己的脚本。虽然一开始什么功能都没有但这个过程能让你理解脚本是如何被创建、编辑和管理的。4.1 打开脚本管理面板与创建新脚本点击工具栏上的油猴图标在下拉菜单中选择“仪表盘”。这是管理所有脚本的控制中心。在仪表盘界面切换到“实用工具”选项卡。在“新建用户脚本”区域点击“文件”选项卡旁边的“新建”按钮一个“”号图标。点击后油猴会为你打开一个新的标签页里面是一个预设好基本框架的脚本编辑器。这就是你的第一个脚本的“出生地”。4.2 解读脚本的“元数据”头部脚本编辑器打开后你会看到一大段被/* UserScript和/UserScript包裹的注释。这部分至关重要它定义了脚本的基本信息、运行规则和权限千万不要删除。我们来逐一解读关键字段// UserScript // name 我的第一个脚本 // namespace http://tampermonkey.net/ // version 0.1 // description 这是一个示例脚本用于学习 // author You // match https://www.example.com/* // grant none // /UserScriptname: 脚本的名称会显示在油猴的脚本列表里。把它改成“网页标题修改器”之类有意义的名称。namespace: 命名空间可以理解为脚本作者的标识通常用你的网站或GitHub地址防止与其他脚本冲突。可以先保留默认或改成你的名字缩写。version: 脚本版本号。每次你修改并更新脚本后应该递增这个版本号如0.1 - 0.2这样油猴才能正确提示更新。description: 脚本描述简单说明这个脚本是干什么的。match:这是核心中的核心。它定义了脚本在哪些网址上会自动运行。支持通配符*。https://www.example.com/*表示在example.com这个域名下的所有页面运行。https://*.baidu.com/*表示在baidu.com的所有子域名下的所有页面运行。你可以同时有多个match行。现在我们把它改成https://www.baidu.com/让我们的脚本只在百度首页生效。grant: 声明脚本需要使用的特殊油猴API权限。none表示不需要任何特殊权限。如果你后续需要操作浏览器存储、发起网络请求等就需要在这里声明如grant GM_setValue。4.3 编写第一个功能修改网页标题在元数据头部下方就是编写JavaScript代码的地方。我们来写一个简单但立刻能看到效果的功能修改百度首页的标题。将编辑器中的代码替换为以下内容// UserScript // name 百度标题修改器 // namespace https://your-namespace.example.com // version 0.1 // description 尝试修改百度首页的标题 // author YourName // match https://www.baidu.com/ // grant none // /UserScript (function() { use strict; // 你的代码写在这里 console.log(我的脚本开始运行了); // 在控制台输出日志用于调试 // 修改网页标题 document.title 【脚本测试】 document.title; // 我们也可以尝试在页面顶部添加一个红色的提示框 let noticeDiv document.createElement(div); noticeDiv.innerHTML strong提示/strong 这个页面正在被我的用户脚本修改; noticeDiv.style.cssText background-color: #ffebee; border: 2px solid #ef5350; padding: 10px; margin: 10px; border-radius: 5px; text-align: center;; document.body.insertBefore(noticeDiv, document.body.firstChild); })();代码解释(function() { ... })();这是一个立即执行函数表达式将我们的代码包裹起来形成一个独立的作用域避免污染网页原有的全局变量这是一个最佳实践。use strict;启用严格模式帮助我们发现一些潜在的编码错误。console.log(...)在浏览器的开发者工具控制台输出信息是调试脚本的必备手段。document.title ...直接修改网页的标题即浏览器标签页上显示的文字。后面几行代码创建了一个新的div元素设置它的内容和样式红色边框、浅红背景然后把它插入到网页正文的最前面。4.4 保存、启用与测试脚本保存脚本在脚本编辑器页面按Ctrl S(Windows) 或Cmd S(Mac) 保存。油猴会自动保存并关闭编辑器标签页。启用脚本回到油猴的“仪表盘”在“已安装脚本”列表里你应该能看到刚刚创建的“百度标题修改器”。确保其右侧的开关是**开启绿色**状态。测试效果打开一个新的浏览器标签页访问https://www.baidu.com。观察浏览器标签页标题应该变成了“【脚本测试】百度一下你就知道”。同时页面最顶部应该出现了一个红色的提示框。按下F12打开开发者工具切换到“Console”控制台标签页你应该能看到输出的“我的脚本开始运行了”这条日志。恭喜你已经成功创建并运行了第一个用户脚本。虽然功能简单但你已经走完了从安装环境到编写代码的完整流程。5. 脚本管理、调试与安全须知脚本运行起来了但要想玩得转还得掌握管理和调试的技巧同时必须树立安全意识。5.1 脚本的日常管理在油猴仪表盘的“已安装脚本”列表里你可以对每个脚本进行精细化管理启用/禁用点击滑块开关。临时不需要某个脚本时禁用它而不是删除。编辑点击脚本名称下方的“编辑”按钮可以重新打开脚本编辑器进行修改。设置齿轮图标可以配置脚本的运行时机如“页面加载完成后”、指定排除的网址、设置自动更新等。删除移除不再需要的脚本。搜索与排序当安装的脚本多起来后利用顶部的搜索框和表头排序功能可以快速定位。5.2 开发者工具调试技巧浏览器自带的开发者工具是脚本调试的利器。打开控制台F12- “Console”。这里会显示脚本中console.log、console.error的输出以及运行时的错误信息。调试时多打日志是定位问题的好习惯。查看脚本运行上下文F12- “Sources”。在左侧文件树中找到“Tampermonkey”或“Violentmonkey”目录展开后就能看到你正在运行的脚本文件。你可以在这里直接设置断点、单步调试就像调试普通网页JS一样。检查元素与样式F12- “Elements”。你可以查看脚本动态添加或修改的DOM元素并实时调整CSS样式来测试效果。5.3 至关重要的安全与隐私守则用户脚本能力强大但也意味着风险。请务必遵守以下原则来源可信只从Greasy Fork、OpenUserJS等知名、有审核机制的脚本平台安装脚本。避免使用来路不明的.user.js文件链接。审查权限在安装脚本前油猴会弹出权限请求告知你脚本将访问哪些网站、拥有哪些能力如读取剪贴板、访问跨域数据等。仔细阅读这些权限如果某个脚本请求的权限与其描述的功能明显不符请果断取消安装。关注作者与更新优先选择活跃、信誉好的作者发布的脚本。关注脚本的更新日志及时更新以修复可能的安全漏洞。最小化安装不要因为好奇就安装大量不用的脚本。每个脚本都会增加页面加载负担和潜在的安全风险。只安装你真正需要且信任的。谨慎对待“破解”类脚本任何声称可以免费获取付费内容、绕过网站限制的脚本都需要极度警惕。它们很可能包含恶意代码窃取你的账号密码或加密货币私钥。6. 常见问题与故障排除实录在实际使用中你肯定会遇到一些问题。这里我整理了几个最常见的情况和解决方法。6.1 脚本安装失败或无法运行问题现象可能原因解决方案点击“安装”按钮无反应脚本管理器未正确安装或启用1. 检查浏览器工具栏是否有油猴/暴力猴图标且未变灰。2. 访问edge://extensions/确认扩展已启用。3. 尝试重启浏览器。安装时提示“脚本损坏”脚本文件下载不完整或平台不兼容1. 刷新Greasy Fork页面重试。2. 检查脚本是否支持你使用的脚本管理器通常都支持。脚本已启用但页面无效果1.match或include规则不匹配当前网址。2. 脚本有Bug导致运行出错。3. 与其他脚本或浏览器扩展冲突。1. 检查脚本的元信息确认当前网址是否匹配规则。2. 打开浏览器控制台(F12-Console)查看是否有红色错误信息。3. 禁用其他脚本或扩展进行排查。6.2 脚本导致网页布局错乱或功能异常这通常是因为脚本操作的DOM元素在网站更新后发生了变化或者脚本的CSS样式与网站原有样式冲突。排查步骤禁用脚本首先在油猴面板中禁用该脚本刷新页面确认问题是否消失。如果消失基本确定是该脚本导致。检查元素使用开发者工具的“检查”功能找到布局错乱的元素查看其样式和HTML结构看是否是脚本添加或修改了不该动的内容。查看脚本代码如果是你自己写的脚本检查选择器是否过于宽泛如document.querySelector(div)可能选中了无数个div。尽量使用更精确的ID、类名或路径选择器。调整运行时机在油猴的脚本设置中将“运行时机”从“文档开始”改为“文档结束”即页面加载完成后。有时脚本跑得太快页面元素还没加载完就去操作就会出错。6.3 脚本更新失败或提示冲突更新失败可能是网络问题可以尝试手动从脚本发布页面重新安装一次覆盖安装。版本冲突如果你从不同来源安装了同名脚本油猴会提示。你需要决定保留哪一个删除另一个。永远以官方或可信源为准。6.4 性能问题脚本让浏览器变卡安装了大量脚本尤其是那些在每一个页面都会运行检查的脚本确实会影响浏览器性能。优化建议定期清理禁用或删除长期不用的脚本。细化匹配规则检查脚本的match规则确保它只在必要的网站上运行而不是*://*/*所有网站。注意脚本设计如果是自己写脚本避免使用setInterval进行高频DOM查询或操作优化代码逻辑。从安装脚本管理器到写出第一行能运行的代码你已经掌握了赋予浏览器超能力的基础。脚本的世界浩瀚如海从简单的样式调整到复杂的自动化工具几乎无所不能。关键在于保持探索和安全意识。下次我们可以深入聊聊如何分析网页结构、编写更实用的脚本比如自动展开评论区、批量处理页面信息等。记住多看看别人写的优秀脚本源码是学习最快的方式。
)
