Tampermonkey介绍

Tampermonkey（油猴或篡改猴）是一个很流行的 用户脚本管理器，可以在浏览器中注入、管理和运行自定义 JavaScript 脚本，从而改变网页行为、增强功能或自动化操作。

安装插件

我这里以Chrome浏览器为例，直接扩展程序-管理扩展程序-chrome应用商店搜索“篡改猴”安装即可。
安装好后再扩展程序里就会出现篡改猴的图标，点击图标选择管理面板可以看到当前所有已经安装的插件脚本，你可以通过点击图标选择获取新脚本进去搜索你需要的脚本。
由于脚本是直接注入浏览器执行，很容易抓取你在浏览器上输入的信息，所以不要随意安装来历不明的脚本，以防被盗取信息。

自己开发插件脚本

开发自己的插件也比较简单，熟悉Javascript脚本即可，比如我最近经常要登录一个平台，反复会要求输入用户名密码点击登录，所以我需要当我进去指定的登录页面时，在页面上注入一个一键登录按钮，点击后自动帮我输入用户名密码信息自动点击登录跳转，就这个简单的场景，我们可以开发一段脚本，代码如下：

// ==UserScript==
// @name         一键登录脚本
// @namespace    http://tampermonkey.net/
// @version      2025-12-24
// @description  try to take over the world!
// @author       You
// @match        http://192.168.5.36:8080/login*
// @grant        GM_addStyle
// ==/UserScript==

GM_addStyle(`
#one-click-login {
    margin-top: 16px;
    width: 100%;
    height: 44px;
    font-size: 16px;
    border-radius: 12px;
    border: none;
    cursor: pointer;
    color: #fff;
    background: linear-gradient(135deg, #286aff, #6a7cff);
}
`);

(function() {
    'use strict';

    const PHONE = '用户名';
    const CAPTCHA = '111111';
    let PASSWORD = '密码';

    function setInputValue(input, value) {
        input.focus();
        input.value = value;
        input.dispatchEvent(new Event('input', { bubbles: true }));
        input.dispatchEvent(new Event('change', { bubbles: true }));
        input.blur();
    }

    const timer = setInterval(() => {
        const form = document.querySelector('form.login-form');
        if (!form) return;

        if (document.getElementById('one-click-login')) {
            clearInterval(timer);
            return;
        }

        const btn = document.createElement('button');
        btn.id = 'one-click-login';
        btn.type = 'button';
        btn.textContent = '一键登录';

        btn.onclick = () => {
            const phoneInput = form.querySelector('input[name="username"]');
            const pwdInput = form.querySelector('input[name="password"]');
            const captchaInput = form.querySelector('input[type="text"][maxlength="6"]');
            const loginBtn = form.querySelector('button.submit');

            if (!phoneInput || !pwdInput || !loginBtn) {
                alert('未找到登录表单元素');
                return;
            }

            setInputValue(phoneInput, PHONE);
            setInputValue(pwdInput, PASSWORD);
            setInputValue(captchaInput, CAPTCHA);

            // 给 Vue 一点时间更新校验状态
            setTimeout(() => {
                loginBtn.click();
            }, 100);
        };

        form.appendChild(btn);
        clearInterval(timer);
    }, 100);
})();

找到ID为form.login-form的表单，在里面追加一个一键登录的按钮，点击按钮后自动填充手机号、密码、验证码，点击一下登录按钮。
其中需要注意的几行代码如下：
@match：匹配地址，只有当地址匹配时当前脚本才会生效
@grant：引入函数，这里引入了一个GM_addStyle，可以用到注入样式
后面的Javascript代码就是注入的代码逻辑
这样当我访问系统的登录页面时，原有的登录按钮下面多了一个一键登录按钮，点击后自动帮我填充了手机号密码验证码，自动登录成功。