浏览器是许多人在互联网上与世界互动的主要工具。然而,网站的默认功能和外观并非总能满足所有人的需求。有时,我们希望网站能有额外的功能,自动完成某些操作,或者改变其显示方式。这时,浏览器扩展和用户脚本就派上了用场。而脚本猫 (ScriptCat) 是一款流行的浏览器用户脚本管理器,它允许用户运行自定义的JavaScript脚本,从而极大地增强和个性化网页浏览体验。我们今天就围绕脚本猫脚本展开,详细解答大家可能有的疑问。

是什么?—— 脚本猫脚本的定义与能力

简单来说,脚本猫脚本是一种小型的JavaScript程序,专门设计用于在浏览器中运行,并对特定的网页或网站执行操作。它们不是独立的应用程序,而是依赖于像脚本猫这样的用户脚本管理器来执行。脚本猫充当了一个平台,拦截浏览器加载的网页,并在这些网页上按照脚本的指示运行代码。

脚本猫脚本能做什么?

脚本猫脚本的能力非常广泛,几乎可以实现任何前端(浏览器端)能完成的任务。具体包括但不限于:

  • 自动化重复性任务: 比如自动填写表单、自动点击按钮、自动签到等。
  • 修改网页界面: 隐藏或移除页面上的特定元素(如广告、弹窗)、改变元素的样式(字体、颜色、布局),甚至重新排列页面内容。
  • 添加新的功能: 在原网页上增加下载按钮、翻译选项、内容过滤器、快捷导航等。
  • 优化用户体验: 比如无限滚动、记住用户的偏好设置、改善网站的兼容性。
  • 绕过某些限制: 在合法和道德的前提下,有时可以绕过一些非必要的、阻碍正常浏览的限制,例如解除复制限制。

本质上,脚本猫脚本赋予了用户自定义网页行为和外观的能力,让用户成为自己浏览器体验的主人。

为什么使用脚本猫脚本?

使用脚本猫脚本的主要原因在于它能够提供一个高度个性化、自动化和效率化的网页浏览环境。

  • 提升效率: 许多网站的流程繁琐,脚本可以自动化这些步骤,节省大量时间和精力。例如,一个脚本可以自动跳过视频前的广告,另一个可以帮助你一键下载网页上的所有图片。
  • 改善用户体验: 移除烦人的广告和弹窗,清理杂乱的界面,或者根据你的习惯调整网站布局,让浏览更加清爽和舒适。
  • 增强功能: 网站开发者并未提供的功能,用户可以通过脚本自行添加。比如,为知乎评论区添加“只看层主”功能,为B站增加额外的弹幕过滤选项。
  • 灵活性和开放性: 与一些固定的浏览器扩展不同,用户脚本通常更轻量,且其代码通常是公开的,用户可以查看、学习甚至修改,这提供了极大的灵活性。
  • 免费且易于获取: 大多数有用的脚本都是由社区开发者免费分享的,获取和安装都非常简便。

使用脚本猫脚本,你不再是被动地接受网站提供的内容和交互方式,而是可以主动塑造你的网络世界。

如何安装脚本猫浏览器扩展?

使用脚本猫脚本的前提是首先在你的浏览器中安装脚本猫(ScriptCat)这款扩展或插件。安装过程与安装其他浏览器扩展类似。

安装步骤(以主流浏览器为例):

  1. 打开你的浏览器(如 Chrome、Edge、Firefox、Opera、Brave 等)。
  2. 访问对应浏览器的扩展商店:
    • Chrome 网上应用店
    • Microsoft Edge Add-ons
    • Firefox Add-ons
    • 或其他浏览器官方扩展商店
  3. 在扩展商店的搜索框中输入“脚本猫”或“ScriptCat”。
  4. 找到名为“ScriptCat”的扩展(通常带有其特有的猫咪图标)。请确保是官方或信誉良好的来源发布的。
  5. 点击“添加到 [你的浏览器名称]”或“安装”按钮。
  6. 浏览器会弹出一个权限请求窗口,说明该扩展需要访问的数据和操作。请仔细阅读这些权限(用户脚本管理器通常需要访问你浏览的所有网站,以便在特定网站上运行脚本),如果信任该扩展,点击“添加扩展”或“允许”按钮。
  7. 安装完成后,浏览器工具栏通常会显示脚本猫的图标。点击该图标可以打开脚本猫的管理界面或菜单。

如果你的浏览器不支持官方扩展商店,或者你希望通过其他方式安装,脚本猫也可能提供离线安装包(.crx 或 .xpi 文件),但这种方式需要你在浏览器设置中启用开发者模式或允许安装来自未知来源的扩展,风险较高,不推荐普通用户使用。

在哪里找到并安装脚本?

安装好脚本猫扩展后,下一步就是获取并安装脚本来使用。脚本猫脚本主要通过在线仓库或文件导入的方式获取。

主要的脚本仓库:

用户脚本社区中最著名和活跃的仓库是:

  • Greasy Fork (greasyfork.org):这是目前最大、最活跃的用户脚本分享平台之一。上面有成千上万个由全球开发者创建和维护的脚本,涵盖了各种网站和功能。

虽然还有其他一些较小的仓库或论坛分享脚本,但Greasy Fork是新手入门和查找常用脚本的首选。

安装脚本的步骤(通过 Greasy Fork):

  1. 打开你的浏览器,访问 https://greasyfork.org
  2. 在 Greasy Fork 网站的搜索框中输入你想要增强的网站名称(如“百度”、“Bilibili”、“知乎”)或功能关键词(如“广告”、“下载”、“视频”)。
  3. 浏览搜索结果,查看脚本的名称、描述、评分、安装量以及更新日期。选择一个看起来有用、评分高且近期有更新的脚本。
  4. 点击进入你感兴趣的脚本详情页。仔细阅读脚本的详细描述,了解其具体功能、兼容性提示以及用户的评论。
  5. 在脚本详情页找到绿色的“安装此脚本”按钮。点击它。
  6. 如果你的脚本猫扩展已经正确安装并运行,它会拦截这次点击,并弹出一个安装确认窗口。这个窗口会显示脚本的元数据(名字、版本、适用的网站等)以及脚本的完整代码。
  7. 重要: 虽然脚本猫本身是安全的,但用户脚本是由第三方个人或团队开发的,它们可以访问你访问的网站内容甚至你的某些操作。在安装任何脚本之前,强烈建议你快速浏览一下代码(如果你懂JavaScript)或至少仔细阅读脚本的描述和用户评论,确保其功能符合你的预期且没有恶意行为。
  8. 确认无误后,点击脚本猫安装窗口中的“安装”按钮。
  9. 安装成功后,脚本猫的管理界面会显示该脚本已添加。现在,当你访问脚本中指定适用的网站时,该脚本就会自动运行了。

其他安装脚本的方式:

  • 直接导入: 如果你获得了脚本的源代码文件(通常是 .user.js 后缀),可以在脚本猫的管理界面中找到“导入”或“从文件安装”的选项,选择该文件进行安装。
  • 从URL安装: 有些地方会直接提供脚本的原始URL,可以在脚本猫中选择“从URL安装”并粘贴链接。
  • 手动新建并粘贴: 如果你只有脚本的代码文本,可以在脚本猫管理界面选择“新建脚本”,然后将代码复制粘贴到编辑器中保存。

使用脚本猫脚本需要多少费用?

这是许多初次接触用户脚本的人关心的问题。答案是:

使用脚本猫扩展和绝大多数脚本猫脚本是完全免费的。

脚本猫扩展本身是一款免费的开源软件(或提供免费使用版本)。 Greasy Fork 等主要的脚本仓库也是免费平台,上面的脚本都是由开发者出于分享和兴趣的目的免费提供的。开发者不会因为你安装或使用他们的脚本而向你收取任何费用。

当然,创建和维护脚本需要开发者花费时间和精力。如果你觉得某个脚本对你非常有帮助, Greasy Fork 等平台通常会提供给开发者一些捐赠渠道(如支付宝、微信支付、PayPal等),你可以选择性地向开发者表达感谢和支持,但这完全是自愿行为,并非强制的。

因此,你可以放心地安装和使用脚本猫及其丰富的脚本资源,享受它们带来的便利,无需担心任何费用。

如何管理已安装的脚本?

安装了一定数量的脚本后,你需要一个地方来查看、启用、禁用、更新或卸载它们。脚本猫提供了直观的管理界面。

管理脚本的常见操作:

  1. 打开脚本猫管理界面: 通常是点击浏览器工具栏上的脚本猫图标,然后在弹出的菜单中选择“管理面板”或类似选项。或者,有些浏览器可以直接右键点击图标选择管理。
  2. 查看已安装脚本列表: 管理面板会列出你所有已安装的脚本,显示它们的名称、版本、适用的网站等信息。
  3. 启用/禁用脚本: 每个脚本旁边通常会有一个开关按钮。点击开关可以立即启用或禁用该脚本。禁用脚本后,它就不会在你访问适用的网站时运行,这对于临时关闭某个脚本或排查问题非常有用。
  4. 更新脚本: 脚本开发者会不定期更新他们的脚本,修复bug或增加新功能。在管理面板中通常会有检查更新的按钮,或者脚本猫会自动检查并提示你更新。点击更新按钮即可安装新版本。
  5. 编辑脚本: 如果你想查看脚本代码或者对其进行简单的修改(例如修改适用的网站),可以点击脚本列表中的脚本名称或编辑按钮,脚本猫会打开内置的代码编辑器。这对于有一定编程基础的用户非常方便。
  6. 卸载脚本: 如果某个脚本不再需要或出现了问题,可以在管理面板中找到该脚本,点击旁边的删除或卸载按钮。卸载是彻底移除该脚本。
  7. 调整脚本顺序/分组: 有些高级脚本管理器支持调整脚本的执行顺序或将脚本分组管理,脚本猫也提供了类似的功能,这有助于管理大量脚本和解决脚本冲突问题。

熟练使用脚本猫的管理界面,能够帮助你更好地控制和维护你的用户脚本环境。

如何入门编写自己的脚本?

如果你有一定的JavaScript基础,并且找不到满足特定需求的现有脚本,或者想学习如何定制,那么自己动手编写脚本是一个非常棒的选择。

编写脚本的基本步骤和要点:

  1. 新建脚本: 打开脚本猫管理界面,找到“新建脚本”或“创建脚本”的按钮。点击后,脚本猫会打开一个内置的代码编辑器,并自动生成一个基本的脚本模板。
  2. 理解元数据块 (Metadata Block): 脚本文件的开头部分是一个特殊的注释块,称为元数据块。它以
    // ==UserScript==

    开始,以

    // ==/UserScript==

    结束。这个块包含了脚本的各种信息和配置,这是脚本猫识别和管理脚本的关键。

    • 常用的元数据标签:

      • // @name

        :脚本的名称,会显示在脚本猫的管理列表中。

      • // @namespace

        :一个唯一的标识符,通常使用作者的域名反写或GitHub地址,用于区分不同作者的同名脚本。

      • // @version

        :脚本的版本号,用于更新。

      • // @description

        :脚本的功能描述。

      • // @author

        :作者名字。

      • // @match

        // @include

        最重要的标签之一。 用来指定脚本应该在哪些网页上运行。可以使用通配符

        *

        。例如,

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

        表示在所有百度域名下的页面运行;

        // @match https://greasyfork.org/*

        只在 Greasy Fork 网站运行。可以有多行

        @match

        @include

        来指定多个适用网站。

      • // @exclude

        :指定脚本不应该在哪些网页上运行,即使它们符合

        @match

        @include

        的规则。

      • // @require

        :用来引入外部的JavaScript库,比如jQuery。脚本猫会在运行你的脚本之前加载这些库。例如,

        // @require https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js
      • // @grant

        :请求额外的权限或浏览器API访问,比如访问剪贴板、跨域请求(

        GM.xmlHttpRequest

        GM_xmlhttpRequest

        )、打开新标签页(

        GM.openInTab

        GM_openInTab

        )等。为了安全,用户脚本默认运行在一个沙箱环境中,需要通过

        @grant

        明确申请更高权限的API。脚本猫支持标准的

        GM.*

        (Greasemonkey API) 和

        GM_xmlHttpRequest

        等旧版API。

  3. 编写JavaScript代码: 在元数据块之后,就是标准的JavaScript代码区域。这里的代码会在符合
    @match

    /

    @include

    规则的页面上执行。

    • 时机: 脚本通常在页面的DOM(文档对象模型)加载完成后执行,但具体取决于脚本管理器的实现。如果要操作页面上的特定元素,最好等待页面完全加载或使用事件监听。
    • 访问页面元素: 使用标准的DOM API来查找和修改页面上的元素,如
      document.getElementById()

      ,

      document.querySelector()

      ,

      document.querySelectorAll()

      示例:改变页面标题颜色

      // ==UserScript==
      // @name         改变标题颜色示例
      // @namespace    http://tampermonkey.net/
      // @version      0.1
      // @description  简单脚本示例
      // @match        https://*.example.com/*
      // @grant        none
      // ==/UserScript==
      
      (function() {
          'use strict';
          // 找到页面的标题元素,比如一个h1标签
          var pageTitle = document.querySelector('h1');
          if (pageTitle) {
              pageTitle.style.color = 'red'; // 将标题颜色改为红色
          }
      })();

      请注意,为了避免污染全局作用域和确保代码隔离,用户脚本的代码通常包裹在一个立即执行函数表达式 (IIFE) 中,如上例所示的

      (function(){...})();

    • 监听事件: 使用
      addEventListener

      来响应用户的交互,比如点击按钮、滚动页面等。

    • 发出网络请求: 如果需要从其他地方获取数据,可以使用浏览器内置的
      fetch

      API 或脚本猫提供的

      GM.xmlHttpRequest

      (用于绕过同源策略进行跨域请求)。

    • 存储数据: 可以使用
      localStorage

      sessionStorage

      在浏览器中存储少量数据,或者使用脚本猫提供的

      GM.setValue

      GM.getValue

      API 来存储跨页面或跨会话的数据。

  4. 保存与测试: 在编辑器中完成代码编写后,点击保存按钮。然后打开或刷新
    @match

    中指定的网页,观察脚本是否按预期工作。

  5. 调试: 如果脚本没有按预期工作,可以使用浏览器开发者工具进行调试。
    • 打开开发者工具(通常按 F12)。
    • 切换到“Console”(控制台)标签页。在脚本中使用
      console.log('消息')

      可以将调试信息打印到控制台。

    • 在“Sources”(源代码)标签页中,可以找到正在运行的用户脚本文件,并在代码中设置断点进行单步调试。

编写脚本是一个不断学习和实践的过程。从简单的修改开始,逐步尝试更复杂的功能。参考 Greasy Fork 上现有脚本的代码是一个很好的学习方法,但要注意理解其逻辑和潜在的风险。

总结

脚本猫脚本是运行在脚本猫用户脚本管理器上的小型JavaScript程序,它们赋予了用户强大的能力,可以自定义和自动化网页浏览体验。从自动完成重复任务到美化网页界面,再到增强网站功能,脚本猫脚本为用户提供了前所未有的灵活性。

使用脚本猫和安装大多数脚本是完全免费的。你可以通过访问 Greasy Fork 等平台轻松找到并安装海量脚本。安装脚本猫扩展后,其管理界面可以方便地管理(启用、禁用、更新、卸载)你的所有脚本。

对于有编程基础的用户,脚本猫提供了内置编辑器和必要的API(通过元数据块中的

@grant

声明),让你能够编写自己的脚本,实现高度定制化的网页功能。

总之,掌握脚本猫和用户脚本的使用,能够显著提升你的网络浏览效率和体验,让互联网更加符合你的个人习惯和需求。


脚本猫脚本