文章正文
在开始编写油猴脚本之前，咱们需要先在浏览器上安装油猴插件，为后续的脚本运行搭建好“舞台”。油猴插件，如Tampermonkey，是通过在浏览器中注入自定义JavaScript脚本来扩展或修改网页功能的强大工具。它适用于Chrome、Firefox、Edge等多种浏览器。
1. 在Chrome浏览器中安装Tampermonkey
- 打开Chrome浏览器。
- 在地址栏输入`chrome://extensions/`回车进入扩展程序页面。
- 启用右上角的“开发者模式”。
- 点击“加载已解压的扩展程序”按钮。
- 选择Tampermonkey插件所在的文件夹，点击确定。
2. 在Firefox浏览器中安装Tampermonkey
- 打开Firefox浏览器。
- 访问Tampermonkey官方插件商店（https://addons.mozilla.org/en-US/firefox/addon/tampermonkey/）。
- 点击“添加到Firefox”按钮。
- 在弹出的确认窗口中点击“添加”完成安装。
3. 在Edge浏览器中安装Tampermonkey
- 打开Edge浏览器。
- 在地址栏输入`edge://extensions/`，回车进入扩展程序页面。
- 启用右上角的“开发者模式”。
- 点击“加载已解压的扩展程序”按钮。
- 选择Tampermonkey插件所在的文件夹点击确定。
安装完油猴插件后，接下来就是创建新的使用者脚本。点击浏览器扩展面板中的Tampermonkey图标，会跳转到一个全新的页面，在这个页面上可创建新的脚本。
- 点击浏览器工具栏上的Tampermonkey图标。
- 在弹出的菜单中选择“管理面板”。
- 在管理面板中，点击左上角的“创建新脚本”按钮。
- 这时会打开一个新的标签页，里面包含了预设的若干元数据信息和脚本主体。
在新建的脚本编辑器中，咱们可直接开始编写我们的之一个油猴脚本。假设我们要编写一个简单的脚本，用于在网页加载完成后，获取当前网页的标题，并将其打印到控制台中。
```javascript
// ==UserScript==
// @namespace http://tampermonkey.net/
// @version 0.1
// @author Your Name
// @match *://*/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
window.addEventListener('load', function() {
const pageTitle = document.title;
console.log('网页标题:', pageTitle);
});
})();
```
- 将上述代码复制到编辑器中。
- 保存脚本并刷新网页查看控制台以获取网页标题的输出。
创建完脚本后，我们还需要学会怎么样管理和维护这些脚本。Tampermonkey提供了丰富的功能来帮助我们更好地管理脚本。
- 在Tampermonkey管理面板中，找到你刚刚创建的脚本。
- 点击脚本名称，可查看和编辑该脚本的内容。
- 要是需要修改脚本直接在这里实行修改即可。
- 在管理面板中，每个脚本前面都有一个开关按钮。
- 点击开关按钮，可启用或禁用当前脚本。
- 当脚本被禁用时，它不会在对应的网页上运行。
- 若是不再需要某个脚本，可以在管理面板中找到该脚本。
- 点击脚本右侧的“删除”按钮即可卸载该脚本。
- 删除后，脚本将不再出现在管理面板中。
对有一定经验的开发者而言，能够尝试利用若干高级功能来优化和扩展本身的油猴脚本。
- 有时我们可能需要利用部分外部的库或资源来增强脚本的功能。
- 可在元数据块中采用`@require`指令来引入外部资源。
例如：
```javascript
// ==UserScript==
// @namespace http://tampermonkey.net/
// @version 0.1
// @author Your Name
// @match *://*/*
// @grant none
// @require https://code.jquery.com/jquery-3.6.0.min.js
// ==/UserScript==
(function() {
'use strict';
$(document).ready(function() {
const pageTitle = document.title;
console.log('网页标题:', pageTitle);
});
})();
```
- 有时，我们的脚本可能需要访问某些特定的域名。
- 可在元数据块中利用`@connect`指令来声明这些权限。
例如：
```javascript
// ==UserScript==
// @namespace http://tampermonkey.net/
// @version 0.1
// @author Your Name
// @match *://*/*
// @grant none
// @connect example.com
// ==/UserScript==
```
- 有时，我们期望脚本能够在不同的时机施行比如页面加载前、加载后等。
- 能够在元数据块中利用`@run-at`指令来指定实施时机。
例如：
```javascript
// ==UserScript==
// @namespace http://tampermonkey.net/
// @version 0.1
// @author Your Name
// @match *://*/*
// @grant none
// @run-at document-end
// ==/UserScript==
```
通过本文的学习，相信你已经掌握了油猴插件的基本采用方法从安装插件到创建脚本，再到管理脚本和利用若干高级技巧。期待这些知识能够帮助你在实际项目中更高效地利用油猴插件，创造出更多有用和有趣的脚本。
房妍
2025-02-07
朱一旦的枯燥生活
2025-02-07
艺术留学女流氓
2025-02-07