Tampermonkey Tampermonkey，中文也叫作「油猴」，它是一款浏览器插件，支持 Chrome。利用它我们可以在浏览器加载页面时自动执行某些 JavaScript 脚本。...获取脚本 Tampermonkey 运行的是 JavaScript 脚本，每个网站都能有对应的脚本运行，不同的脚本能完成不同的功能。...•@run-at：脚本注入的时刻，如页面刚加载时，某个事件发生后等等。例如：•document-start：尽可能地早执行此脚本。•document-body：DOM 的 body 出现时执行。...•@noframes：此标记使脚本在主页面上运行，但不会在 iframe 上运行。...•@nocompat：由于部分代码可能是专门为专门的浏览器所写，通过此标记，Tampermonkey 会知道脚本可以运行的浏览器。
它提供了诸如便捷脚本安装、自动更新检查、标签中的脚本运行状况速览、内置的编辑器等众多功能， 同时Tampermonkey还有可能正常运行原本并不兼容的脚本。...访问限制 @include 脚本允许运行的页面，可以是多个标签实例。...当@match 为 * 时，当访问任何一个页面都会alter出对应的内容来。如下图所示 ? @match @match 与 @include 非常相似，然而@match更安全。...脚本中可以有任意数量的@require 键。每个 @require 在安装脚本时下载一次，并与脚本一起存储在用户的硬盘驱动器上。指定的 URL 可能与安装脚本的 URL 相关。...每个@resource 必须有一个唯一的名称。 每个@resource 在安装脚本时下载一次，并与脚本一起存储在用户的硬盘驱动器上。指定的 URL 可能与安装脚本的 URL 相关。
前些天开发了个OneDrive下载直链提取的油猴脚本，也是我第一次开发有复杂操作界面的油猴脚本。很早之前，我也写过一些有图形界面的脚本（参见：两个油猴脚本分享），只不过那个界面太简单。...但Vue与Webpack提供的热加载方案又属实好用，因此要是想用上热加载，就需要将脚本中界面的部分进行抽离。换言之就是独立出脚本功能模块，并给每个导出的模块函数编写Mock。...热加载与调试 UI开发时，可以使用热加载的方式进行测试。可以通过HtmlWebpackPlugin创建空白页面进行测试，之后启动webpack的热模块替换。...然后在油猴后台创建新脚本，仅复制Tampermonkey的脚本信息段，并在之后加入一条： @require file://[编译生成文件路径] 这样，修改程序后刷新待测试页面就可以进行测试了。...但是这样的测试效果是非常有限的，因为所有测试代码只能运作于原始页面的静态“快照”上。对于前端渲染的页面，甚至需要取其渲染结果进行测试，无法在单元测试时将待测试原始页面的获取自动化。
Tampermonkey，又称 Greasemonkey 油猴脚本，是一款免费的浏览器扩展，可用于管理用户脚本，它本质上是对浏览器接口的二次封装 油猴脚本可用于更改页面布局样式、完成页面自动化、去广告...介绍 Tampermonkey 特点包含： 内置的编辑器，可以非常方便地管理、编辑用户脚本 支持自动更新检查功能 标签中脚本运行状态速览 可以通过压缩文件、云存储进行脚本备份及还原 通过面板新建一个用户脚本...@match 使用通配符执行需要匹配运行的网站地址 @exclude 排除匹配到的网站 @grant 指定脚本运行所属的权限 @connect 用于跨域访问时指定的目标网站域名 @run-at...www.baidu.com",{ active: true, setParent :true}); ... 2-5 跨域请求 在授予 GM_xmlhttpRequest 权限之后，就可以跨域发送请求了 PS：第一次跨域请求时...接着，添加一个定时任务，获取每一页底部的加载更多按钮 最后，判断元素存在时，执行点击操作即可 ...
@supportURL 定义使用者报告issues和个人支持的地址 @include 脚本应该运行的页面， 可以使用正则匹配。...允许多个标签 @require 指向一个脚本文件，会在本脚本运行前加载并执行 注意：通过@require加载的脚本及其“use strict”语句可能会影响用户脚本的strict模式！...如果@grant后跟“none”，沙盒将被禁用，脚本将直接在页面上下文中运行。在此模式下，没有gm_u*函数，但gm_u info属性将可用。...示例 // @grant none @noframes 这个标签表明脚本在主页面上运行，而不是在iframes里 @unwrap 这个标签是被忽略的，因为他在谷歌浏览器里不需要 @nocompat 目前...，tm试图通过查找@match标记来检测脚本是否是在google chrome/chromium的知识中编写的，但并不是每个脚本都使用它。
我们打开一个名为京东每日签到助手的脚本，可以看到核心思路是通过脚本打开不同的页面如会员签到页面，店铺抽奖页面等等，定位并点击对应的签到/抽奖按钮。 ?...至此，我们大概了解到Tampermonkey能实现以下几个功能： 获取页面信息 操作页面元素 改变DOM结构 引入自定义JS脚本，CSS等 >>>> 三、油猴的内置API？...这里不一一介绍每个API的使用方法，可以在官网自行查看 (https://tampermonkey.net/documentation.php?...version=4.6) >>>> 四、如何在测试过程中使用油猴 这里举几个例子来展示，在实际测试中如何使用油猴提升一定的测试效率。 1、Web页面的性能数据展示 ?...下面的例子展示了页面加载完成之后打印对应的性能数据，如果有数据超过期望的可以做alert提示。 ?
content_scripts：Chrome 插件中向页面注入脚本的一种形式，包括地址匹配（支持正则表达式），要注入的 JS、CSS 脚本，代码注入的时间（建议 document_start，网页开始加载时就注入...，有可能你编写的某个插件在其他浏览器上运行不了，而 TamperMonkey 就可以帮助我们解决这个问题，TamperMonkey 俗称油猴插件，它本身就是一个浏览器扩展，是最为流行的用户脚本管理器，基本上支持所有带有扩展功能的浏览器...，实现了脚本的一次编写，所有平台都能运行，用户可以在 GreasyFork、OpenUserJS 等平台直接获取别人发布的脚本，功能众多且强大，同样的，我们也可以利用 TamperMonkey 来实现...如果不指定的话，油猴会默认添加几个最常用的 API @require 如果脚本依赖其他 JS 库的话，可以使用 require 指令导入，在运行脚本之前先加载其它库 @run-at 脚本注入时机...：载入完成后执行，默认选项；context-menu：在浏览器上下文菜单中单击该脚本时，一般将其设置为 document-start 重新来到航班查询页面，启用 TamperMonkey 脚本，如果配置正确的话
如何运行一个浏览器脚本 安装用户脚本管理器 首先需要安装一个脚本管理器插件，Tampermonkey支持Chrome、Firefox、Safari、Microsoft Edge等主流浏览器，可以在https...如Chrome可以打开链接https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo...[add penguin user script] 运行用户脚本 安装之后打开或刷新http://www.qq.com 页面就能看到页面已经改变！...author 作者 match 匹配的页面URL，即脚本可以生效运行的页面地址 grant 脚本需要获得的权限，如unsafeWindow等 修改页面样式 下面以修改百度搜索结果的页面为例，简单写个...这是因为用户脚本默认是在页面完成加载后开始执行的，但是在搜索结果页面再次搜索时，百度是通过ajax请求的方式来获取结果的，而在结果返回后，head标签内的所有style标签会被重置掉。
它提供了诸如便捷脚本安装、自动更新检查、标签中的脚本运行状况速览、内置的编辑器等众多功能， 同时 Tampermonkey 还有可能正常运行原本并不兼容的脚本。...@supportURL：使用者报告 issues 和个人支持的地址 @include：脚本应该运行的页面， 可以使用正则匹配。...，会在本脚本运行前加载并执行 我们可以使用这个配置 引入 jQuery 不过要注意：通过 @require 加载的脚本及其“use strict”语句可能会影响用户脚本的 strict 模式！...// @connect value value 可以是以下几个值： 域可以是：tampermokey.net（可以允许子域名），子域名如：safari.tampermokey.net self：列出脚本当前运行的域...这意味着，使用 @require 标记的脚本可能会在文档已加载后执行，因为获取所需脚本花费了很长时间。
我之前接触过一个Chrome的插件叫 TamperMonkey，这个工具允许用户自己创建js脚本并挂载到目标网页上，以实现修改网页样式、行为的目的。...TamperMonkey下载地址： 微云下载 下载完成后，打开Chrome的Extensions页面： 将刚刚下载的.crx插件文件拖到Extensions窗口，点击...TamperMonkey脚本 我们先来看下google的jquery引用在页面中的样子： 可以看到就是普通的script标签，现在我们的思路应该比较明确了，就是用javascript...首先我们打开TamperMonkey，新建一个脚本。...首先我们需要设置脚本运行的时间点，我们希望在google的jquery script刚被添加到DOM中时就替换它，但是在查阅了大量的资料后我发现这个做不到（如果有人知道怎么做，欢迎留言），所以我们只能选择在尽量早的时间点去执行脚本
在日常浏览网页时，我们有时会遇到一些不太满意的网站界面交互设计。然而，作为普通用户，我们并没有网站的源码，如何在这种情况下进行界面改造呢？...油猴（Tampermonkey）是一款非常流行的浏览器扩展，它可以让用户自定义网页行为。通过编写用户脚本（UserScript），我们可以修改网页的内容和样式，甚至添加新的功能。...油猴支持多种浏览器，如Chrome、Firefox、Edge等。 油猴脚本的基本使用 安装油猴插件 首先，我们需要在浏览器中安装油猴插件。...搜索“Tampermonkey”，点击“添加至Chrome”按钮进行安装。 安装完成后，浏览器右上角会出现一个油猴的图标。 编写和安装用户脚本 安装好油猴插件后，我们可以开始编写用户脚本。...打开Chrome浏览器，进入“扩展程序”页面（chrome://extensions/）。 打开“开发者模式”，点击“加载已解压的扩展程序”，选择刚才创建的文件夹。
刚才其实也说了，我们的 Hook 代码是在控制台手动输入的，一旦刷新页面就不生效了，这的确是个问题。而且它必须是在页面加载完了才注入的，所以它并不能在一开始就生效。...此时可能提示页面崩溃，但是不用担心，重新刷新页面就好了，这时候我们就发现现在浏览器加载的 JavaScript 文件就是我们修改过后的了，文件的下方会有一个标识符，如图所示。 ?...利用它我们可以在浏览器加载页面时自动执行某些 JavaScript 脚本。...由于执行的是 JavaScript，所以我们几乎可以在网页中完成任何我们想实现的效果，如自动爬虫、自动修改页面、自动响应事件等等。...首先我们可以点击 Tampermonkey 插件图标，点击「管理面板」按钮，打开脚本管理页面。 image.png 界面类似显示如下图所示。 ?
安装方法 1.目前仅在 Chrome 核心浏览器验证通过，Firefox 用户可以自行尝试使用油猴加载脚本。...2.点我安装用户脚本管理扩展 Tampermonkey（需访问国外网站），或点我下载CRX文件，拖动到扩展管理界面安装（提取码：6792） 3.点我安装脚本:“京东推广自动清除” 4.在弹出的窗口中点击安装...使用说明 安装完成后，自任意来源点击进入B2C商城返利链接时，页面会自动刷新一次用以清洗推广信息。...如需要通过自己的返利链接下单时，请按如下方法临时关闭： 1.在浏览器右上角找到Tampermonkey图标并点击 2.点击”京东推广自动清除”前的绿色圆圈，切换为红色 下单完成后务必记得重新点击切换为绿色...由于亚马逊 cookies 写入时间特殊，页面会在加载完成后1.5秒刷新。 在易迅点击某些活动链接时也会有一次性刷新现象，属于已知问题，无实际影响。
使用 Tampermonkey，您可以运行一个用户脚本，解决这些问题，让您的 ChatGPT 使用体验更加流畅。图片1....点击官网页面上的"去商店"/“Get Chrome Extension”按钮:图片1.2 添加插件至浏览器页面跳转到 Chrome 网上应用店的 Tampermonkey 页面。...访问 KeepChatGPT 脚本页面，点击页面左侧的绿色“安装此脚本”按钮。图片2.2 安装脚本Tampermonkey 插件会自动打开一个新窗口，显示脚本的详细信息。...使用 KeepChatGPT 脚本现在，您已成功安装了 Tampermonkey 插件和 KeepChatGPT 脚本。...当您访问 ChatGPT 网页端时，KeepChatGPT 脚本会自动运行，解决浏览器访问中可能出现的断开连接或报错问题。您可以流畅地使用 ChatGPT，享受更好的用户体验。图片
21 通过这样的方法，我们就可以在设置某个值的时候，添加一些代码，比如 debugger;，让其断下，然后利用调用栈进行调试，找到参数加密、或者参数生成的地方，需要注意的是，网站加载时首先要运行我们的...Edge、Safari、Opera、Firefox、UC 浏览器、360 浏览器、QQ 浏览器等等，基本上实现了脚本的一次编写，所有平台都能运行，可以说是基于浏览器的应用算是真正的跨平台了。...我们依旧以某奇艺的 cookie 为例来演示如何编写 TamperMonkey 脚本，首先去应用商店安装 TamperMonkey，安装过程不再赘述，然后点击图标，添加新脚本，或者点击管理面板，再点击加号新建脚本...如果不指定的话，油猴会默认添加几个最常用的 API @require 如果脚本依赖其他 JS 库的话，可以使用 require 指令导入，在运行脚本之前先加载其它库 @run-at 脚本注入时机...：载入完成后执行，默认选项；context-menu：在浏览器上下文菜单中单击该脚本时，一般将其设置为 document-start 清除 cookie，开启 TamperMonkey 插件，再次来到某奇艺首页
TamperMonkey 提供了一种在网站上运行自己脚本的一种方式，应该成为我们工具箱里的一种常用工具。...@match @match 规定了脚本在什么网站上运行，http*://*/* 表明运行在所有的网站上，* 可用作通配符。...currently running at localhost to access the localhost 1.2.3.4 to connect to an IP address @require 加载脚本的依赖...@run-at 定义脚本的运行时机，支持 document-start, document-body, document-end, document-idle(default), context-menu...unsafeWindow 是当前页面的 JS window 对象，可以引用到所有的全局变量。
什么是油猴脚本？ Tampermonkey（油猴），是一款免费的基于浏览器的扩展插件，它本身并不具备能影响浏览器的功能，需要安装其他脚本来发挥特殊的功能。也就是说，他是一个脚本管理器。...虽然有些受支持的浏览器拥有原生的用户脚本支持，但Tampermonkey将在您的用户脚本管理方面提供更多的便利。...它提供了诸如便捷脚本安装、自动更新检查、标签中的脚本运行状况速览、内置的编辑器等众多功能， 同时Tampermonkey还有可能正常运行原本并不兼容的脚本 如何安装（使用）？...将下载好的后缀为：.crx的文件拖入浏览器该页面中即可。...那我们就将.crx文件重命名，后缀修改为.zip然后进行放到合适的位置解压，然后到扩展程序页面，将开发者模式打开，点击左上角加载已解压的扩展程序，选择解压出来的文件夹即可。
什么是油猴脚本？ Tampermonkey（油猴），是一款免费的基于浏览器的扩展插件，它本身并不具备能影响浏览器的功能，需要安装其他脚本来发挥特殊的功能。也就是说，他是一个脚本管理器。...虽然有些受支持的浏览器拥有原生的用户脚本支持，但Tampermonkey将在您的用户脚本管理方面提供更多的便利。...它提供了诸如便捷脚本安装、自动更新检查、标签中的脚本运行状况速览、内置的编辑器等众多功能， 同时Tampermonkey还有可能正常运行原本并不兼容的脚本 如何安装（使用）？...将下载好的后缀为：.crx的文件拖入浏览器该页面中即可。 离线安装包下载地址 3.如果拖入.crx后缀的文件后提示：该扩展程序未列在 Chrome 网上应用店中，并可能是在您不知情的情况下添加的。...那我们就将.crx文件重命名，后缀修改为.zip然后进行放到合适的位置解压，然后到扩展程序页面，将开发者模式打开，点击左上角加载已解压的扩展程序，选择解压出来的文件夹即可。
目录前言什么是油猴脚本？为什么要使用油猴脚本？如何编写油猴脚本？安装Tampermonkey插件安装油猴脚本脚本解读运行脚本总结前言你好，我是喵喵侠。...油猴脚本（Tampermonkey Script）是一个用户脚本管理器，可以在用户浏览网页时执行自定义的JavaScript代码。...减少错误：避免手动复制粘贴时可能出现的错误。如何编写油猴脚本？以下是编写油猴脚本的步骤和示例代码。安装Tampermonkey插件首先，你需要在浏览器中安装Tampermonkey插件。...@run-at这个很关键，就是你的脚本的运行方式，我这里写的context-menu，代表的是右键运行。...运行脚本保存并激活脚本后，打开任意网页，在空白处右键，你会在菜单中看到这个脚本的名字“markdown生成带网页标题的链接”的选项。
什么是油猴脚本？ Tampermonkey（油猴），是一款免费的基于浏览器的扩展插件，它本身并不具备能影响浏览器的功能，需要安装其他脚本来发挥特殊的功能。也就是说，他是一个脚本管理器。...虽然有些受支持的浏览器拥有原生的用户脚本支持，但Tampermonkey将在您的用户脚本管理方面提供更多的便利。...它提供了诸如便捷脚本安装、自动更新检查、标签中的脚本运行状况速览、内置的编辑器等众多功能， 同时Tampermonkey还有可能正常运行原本并不兼容的脚本。 如何安装（使用）？...将下载好的后缀为：.crx的文件拖入浏览器该页面中即可。...那我们就将.crx文件重命名，后缀修改为.zip然后进行放到合适的位置解压，然后到扩展程序页面，将开发者模式打开，点击左上角加载已解压的扩展程序，选择解压出来的文件夹即可。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
云直播
