油猴脚本通过JavaScript实现网页自动化,需定义元数据块声明名称、版本、匹配网址等信息,使用@match指定生效页面,@run-at控制执行时机,结合GM_ API实现存储、请求、样式注入等功能,并通过DOM操作与事件绑定实现页面交互,适用于广告过滤、功能增强等场景。

如果您想让浏览器自动执行某些网页操作,例如去除广告、修改页面样式或增强功能,可以使用油猴脚本实现自动化控制。以下是关于油猴脚本编写的基本方法和常用语法说明。
本文运行环境:MacBook Pro,macOS Sonoma
一、油猴脚本的基本结构
油猴脚本以JavaScript为基础,通过在脚本头部定义元数据来控制其行为。这些元数据决定了脚本在哪些页面运行、何时注入以及需要请求哪些权限。
1、每个油猴脚本必须包含一个以// ==UserScript==开头的元数据块,该块用于声明脚本的配置信息。
2、元数据块中常见的字段包括:@name(脚本名称)、@namespace(命名空间)、@version(版本号)、@description(描述)、@match(匹配网址)等。
3、元数据块结束后需添加// ==/UserScript==作为结束标记,之后编写实际的JavaScript代码逻辑。
二、使用@match指定生效页面
@match指令用于定义脚本应在哪些URL上运行,支持通配符和正则表达式模式,确保脚本只在目标网页加载。
1、基本写法为// @match https://example.com/*,表示脚本将在https://example.com/下的所有子路径运行。
2、可添加多个@match行以支持不同域名,例如同时作用于百度和知乎搜索页。
3、若需精确匹配特定页面,可写成// @match https://www.google.com/search*,仅对Google搜索结果页生效。
三、设置脚本执行时机
通过@run-at指令控制脚本注入的时间点,避免因DOM未加载完成而导致操作失败。
1、默认情况下脚本在页面加载完成后执行,但可通过// @run-at document-start提前注入,在页面开始渲染前运行。
2、若需等待DOM完全构建后再执行,可使用// @run-at document-end,等效于监听DOMContentLoaded事件。
3、对于动态内容较多的网站(如单页应用),建议结合MutationObserver或setTimeout进行元素监测。
四、调用GM_ API增强功能
油猴提供了GM_系列API,允许脚本突破普通JavaScript的限制,实现跨域请求、本地存储等功能。
1、使用GM_setValue(key, value)和GM_getValue(key, default)实现持久化数据存储。
2、通过GM_xmlhttpRequest(details)发起跨域HTTP请求,参数对象需包含method、url和onload回调函数。
3、利用GM_addStyle(css)向页面注入CSS规则,可用于隐藏元素或美化界面。
4、调用GM_registerMenuCommand(name, fn)在油猴面板中添加自定义菜单项,便于用户手动触发功能。
五、处理页面元素与事件绑定
脚本常需修改或监听网页中的特定元素,需正确选择目标并绑定交互逻辑。
1、使用document.querySelector()或document.querySelectorAll()获取目标DOM节点。
2、当目标元素由JavaScript异步生成时,应使用MutationObserver监听DOM变化,一旦出现目标即执行操作。
3、为按钮或其他控件绑定点击事件时,采用element.addEventListener('click', handler)方式注册回调函数。
4、注意避免污染全局命名空间,将主逻辑封装在匿名函数或IIFE中执行。










