【Tampermonkey】第二章：环境搭建 - 编写你的第一个脚本

第二章：环境搭建 - 编写你的第一个脚本 🛠️

欢迎来到第二章！在上一章中，我们了解了Tampermonkey的基本概念和安装方法。现在，我们将正式开始我们的脚本编写之旅。本章结束时，你将拥有自己的第一个能正常工作的用户脚本！

Tampermonkey的界面初探 👀

成功安装Tampermonkey后，让我们先来熟悉一下它的界面。点击浏览器右上角的Tampermonkey图标，你会看到一个下拉菜单。

（图：Tampermonkey的下拉菜单）

这个菜单中主要包含以下选项：

• 已安装的用户脚本：显示当前已安装的脚本列表及其状态
• 获取新脚本：跳转到脚本分享网站
• 添加新脚本：创建一个新的空白脚本
• 仪表盘：打开Tampermonkey的主界面
• 设置：管理Tampermonkey的各项设置
• 常规/实用工具：一些额外的功能选项

点击"仪表盘"选项，进入Tampermonkey的主界面。在这里，你可以看到更详细的脚本管理选项。

（图：Tampermonkey的仪表盘主界面）

创建你的第一个脚本 ✏️

现在，让我们创建第一个脚本。有两种方法可以创建新脚本：

方法一：通过下拉菜单创建

1. 点击浏览器中的Tampermonkey图标
2. 在下拉菜单中选择"添加新脚本"

方法二：通过仪表盘创建

1. 进入Tampermonkey仪表盘
2. 点击顶部标签栏中的"+"号或"新建用户脚本"按钮

无论使用哪种方法，Tampermonkey都会打开一个编辑器窗口，其中已经包含了一个模板脚本：

// ==UserScript==
// @name         New Userscript
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        https://www.example.com/*
// @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant        none
// ==/UserScript==

(function() {
   
   
    'use strict';
    
    // Your code here...
})();

理解脚本结构 📝

在开始编写代码前，让我们先了解一下用户脚本的基本结构。每个脚本通常由两部分组成：

1. 元数据块（UserScript Header）

位于脚本顶部，包含在// ==UserScript==和// ==/User