如何通过Tampermonkey实现Chrome特定网站加载时自动运行自定义JS脚本

• 第一步：打开Tampermonkey新建脚本
  点击Chrome扩展栏的Tampermonkey图标，选择「添加新脚本」，进入内置的脚本编辑界面，默认的模板内容可以全部清空。

• 第二步：配置脚本头规则
  将下方的基础配置粘贴到编辑页最上方，根据你的需求修改参数：

// ==UserScript==
// @name         你的脚本名称
// @version      0.1
// @description  脚本功能描述
// @match        https://目标网站域名/*
// @grant        none
// @run-at       document-end
// ==/UserScript==

关键参数说明：

• @match：替换为你要适配的网站地址规则，支持通配符*，比如匹配所有GitHub页面可以填https://github.com/*

• @run-at document-end：指定脚本在页面DOM加载完成后执行，完全符合页面加载完再运行的需求

• @grant none：普通JS脚本无需调用Tampermonkey扩展API时，直接用该配置即可

• 第三步：填入你的自定义脚本代码
  把你已经写好的JavaScript代码直接粘贴到上述配置的下方即可，无需额外封装。如果你的逻辑依赖页面的动态渲染元素，可以额外添加元素监听逻辑：

// 可选：等待指定元素加载完成后再执行你的逻辑
function waitForEl(selector, callback) {
  const el = document.querySelector(selector)
  if (el) return callback(el)
  setTimeout(() => waitForEl(selector, callback), 100)
}

// 调用示例
waitForEl('你要等待的元素选择器', () => {
  // 你的脚本逻辑写在这里
})

• 第四步：保存启用脚本
  按下Ctrl+S（Mac系统按Cmd+S）保存脚本，Tampermonkey会自动启用该规则。之后每次打开匹配的目标网站，脚本都会自动注入运行，无需手动打开控制台执行。

验证小技巧：你可以在脚本开头加一行console.log('自定义脚本已启动')，打开目标网站的控制台，看到对应输出就说明脚本运行正常。

内容的提问来源于stack exchange，提问作者janstrw