油猴脚本编写方法 油猴开发环境与脚本示例说明

1、安装Tampermonkey并创建新脚本；2、编写含元数据块和JS代码的脚本，如修改背景色；3、用@match或@include设定执行网址；4、通过@grant调用GM API实现存储或跨域请求；5、利用开发者工具调试报错与逻辑问题。

如果您希望自定义网页行为或增强浏览器功能，可以通过编写油猴脚本实现对目标页面的自动化操作或内容修改。以下是搭建开发环境及编写脚本的具体步骤：

本文运行环境：MacBook Pro，macOS Sonoma

一、安装油猴扩展并配置开发环境

油猴脚本依赖于支持用户脚本的浏览器扩展，最常用的是 Tampermonkey 或 Greasemonkey。安装后即可在浏览器中加载和运行自定义脚本。

1、打开浏览器插件商店，搜索 Tampermonkey 并安装到浏览器中。

2、安装完成后点击浏览器工具栏中的 Tampermonkey 图标，进入仪表盘界面。

3、点击“创建新脚本”按钮，将默认代码清空，准备编写新的用户脚本。

二、编写基础油猴脚本结构

每个油猴脚本都必须包含元数据块（Metadata Block），用于声明脚本名称、匹配网址、授权权限等信息，这是脚本正确加载的前提。

1、在编辑器中输入以下元数据格式：

// ==UserScript==

// @name 示例脚本

// @namespace http://tampermonkey.net/

// @version 1.0

// @description 尝试为指定网站添加自定义功能

// @author 您的名字

// @match https://example.com/*

// @grant none

一览AI编剧

创意生成+情节生成+脚本生成，AI编剧3步走，AI自动帮你搞定剧情！

87

查看详情

// ==/UserScript==

2、在元数据下方添加 JavaScript 代码，例如：document.body.style.backgroundColor = "lightblue";，用于改变页面背景色。

3、点击“保存”按钮，脚本将在匹配的网页加载时自动执行。

三、使用 @match 与 @include 控制脚本触发范围

@match 和 @include 用于定义脚本应在哪些 URL 上运行，合理设置可避免脚本在不相关页面误执行。

1、若要使脚本仅在特定域名下运行，请使用 @match 指令，例如：@match https://www.baidu.com/*。

2、若需支持多个站点，可添加多行 @match 指令，每行对应一个 URL 模式。

3、@include 支持通配符和正则表达式，适用于动态路径，如：@include /^https://news\.sina\.com\.cn/\d{4}/\d{2}/\d{2}/.*\.html$/。

四、调用 GM API 实现高级功能

通过 @grant 声明权限，可以使用油猴提供的 GM_ 开头的 API，实现跨域请求、本地存储等浏览器原生 JS 无法直接完成的操作。

1、在元数据中添加：@grant GM_setValue 和 @grant GM_getValue，以启用持久化数据存储功能。

2、使用 GM_setValue("key", "value") 保存用户偏好设置，后续可通过 GM_getValue("key") 读取。

3、若需发送跨域请求，添加 @grant GM_xmlhttpRequest，并调用该方法获取外部资源。

五、调试油猴脚本的常见问题

脚本可能因语法错误、作用域限制或权限缺失而无法正常运行，需借助开发者工具进行排查。

1、按 F12 打开开发者工具，在“Console”标签页查看是否有红色报错信息。

2、确认脚本是否已启用，在 Tampermonkey 面板中检查脚本状态是否为绿色“开启”。

3、在关键位置插入 console.log() 输出变量值，验证逻辑流程是否符合预期。

以上就是油猴脚本编写方法 油猴开发环境与脚本示例说明的详细内容，更多请关注php中文网其它相关文章！