油猴脚本教程案例【键盘监听】-编写 ChatGPT 快捷键优化

本文主要是介绍油猴脚本教程案例【键盘监听】-编写 ChatGPT 快捷键优化,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

文章目录

  • 1. 元数据
    • 1. `name`
    • 2. `namespace`
    • 3. `version`
    • 4. `description`
    • 5. `author`
    • 6. `match`
    • 7. `grant`
    • 8. `icon`
  • 2. 编写函数
    • .1 函数功能
      • 2.1.1. `input` - 聚焦发言框
      • 2.1.2. `stop` - 取消回答
      • 2.1.3. `newFunction` - 开启新窗口
      • 2.1.4. `scroll` - 回到底部
  • 3. 监听键盘事件
    • 3.1 监听X - 开启新对话
    • 3.2 监听Z - 取消回答
    • 3.3 监听/ - 聚焦发言框
    • 3.4 监听L - 回到底部
  • 4.完整代码
  • 5.使用

1. 元数据

当编写油猴脚本时,元数据是脚本的一些基本信息,它们提供了关于脚本的描述和配置。以下是元数据的详细解释和用法:

1. name

解释: 这是脚本的名称,用于标识脚本的主题或功能。

用法:

// @name         ChatGPT快捷键优化

2. namespace

解释: 命名空间用于定义脚本的唯一标识符,通常是脚本的作者或网站。

用法:

// @namespace    http://tampermonkey.net/

3. version

解释: 版本号表示脚本的版本。每次更新脚本时,都应该递增版本号。

用法:

// @version      0.1

4. description

解释: 描述字段提供了对脚本功能的简要说明。

用法:

// @description  ChatGPT快捷键优化,添加新建、停止、输入功能

5. author

解释: 作者字段用于指定脚本的作者。

用法:

// @author       Your Name

6. match

解释: 匹配字段定义了脚本执行的网页地址。只有在匹配的网页上,脚本才会生效。

(支持正则表达式匹配)

用法:

// @match        https://chat.openai.com/*

7. grant

解释: @grant 字段用于定义脚本使用的油猴 API 功能。在这个例子中,是为了添加样式。

用法:

// @grant        GM_addStyle

8. icon

解释: 图标字段用于指定脚本在油猴管理界面中显示的图标。

用法:

// @icon         https://cdn.oaistatic.com/_next/static/media/apple-touch-icon.59f2e898.png

2. 编写函数

油猴脚本支持原生的JavaScript编程

.1 函数功能

2.1.1. input - 聚焦发言框

function input() {var input_button = document.querySelector('#prompt-textarea');input_button.focus();
}

在这里插入图片描述

2.1.2. stop - 取消回答

function stop() {var stop_button = document.querySelector(".flex.h-full.flex-row.items-center.justify-center.gap-3>button");stop_button.click();
}

在这里插入图片描述

2.1.3. newFunction - 开启新窗口

function newFunction() {var new_button = document.querySelector('.flex.w-full.gap-2.items-center.justify-center');new_button.click();
}

在这里插入图片描述

2.1.4. scroll - 回到底部

function scroll() {var down_button= document.querySelector('div.flex.h-full.flex-col > div.flex-1.overflow-hidden > div > div > div > button');down_button.click();
}

在这里插入图片描述

3. 监听键盘事件

3.1 监听X - 开启新对话

document.addEventListener('keydown', function (event) {if (event.shiftKey && event.ctrlKey && event.key.toLowerCase() === 'x') {newFunction(); // 表示shift + ctrl + X 即可新建对话}
});

3.2 监听Z - 取消回答

document.addEventListener('keydown', function (event) {if (event.shiftKey && event.ctrlKey && event.key.toLowerCase() === 'z') {stop();// 表示shift + ctrl + Z 即可取消回答}
});

3.3 监听/ - 聚焦发言框

document.addEventListener('keydown', function (event) {if (event.shiftKey && event.ctrlKey && event.code === 'Slash') {input();// 表示shift + ctrl + / 即可聚焦到发言框}
});

3.4 监听L - 回到底部

document.addEventListener('keydown', function (event) {if (event.shiftKey && event.ctrlKey && event.key.toLowerCase() === 'q') {input();// 表示shift + ctrl + Q 即可聚焦到发言框}
});

4.完整代码

// ==UserScript==
// @name         GPT快捷键优化
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  快捷使用
// @author       D0ublecl1ck
// @match        https://chat.openai.com/*
// @grant        GM_addStyle
// @icon         https://cdn.oaistatic.com/_next/static/media/apple-touch-icon.59f2e898.png
// ==/UserScript==(function () {'use strict';// 定义要执行的函数function stop() {// 这里是 stop 函数的具体实现var stop_button = document.querySelector(".flex.h-full.flex-row.items-center.justify-center.gap-3>button");stop_button.click();}function scroll() {// 这里实现点击回到底部var down_button = document.querySelector(".m-1.text-black.dark");down_button.click();}function newFunction() {// 这里是 new 函数的具体实现var new_button = document.querySelector('.flex.w-full.gap-2.items-center.justify-center');new_button.click();}function input() {// 这里是 input 函数的具体实现var input_button = document.querySelector('#prompt-textarea');input_button.focus();}// 监听键盘事件document.addEventListener('keydown', function (event) {// 判断是否按下了 Shift 和 Ctrl 键if (event.shiftKey && event.ctrlKey) {if (event.key.toLowerCase() === 'x') {// 判断按下的是 X 键// 新的对话newFunction();} else if (event.key.toLowerCase() === 'z') {// 判断按下的是 Z 键// 停止回复stop();} else if (event.code === 'Slash') { // 判断按下的是 / 键// 聚焦搜索框input();} else if (event.key.toLowerCase() === 'l') {// 判断按下的是 L 键// 点击回到底部scroll();}}});
})();

5.使用

点击添加新脚本
在这里插入图片描述
删除初始的数据代码,复制粘贴我们的代码之后 CTRL+S保存即可。
在这里插入图片描述

这篇关于油猴脚本教程案例【键盘监听】-编写 ChatGPT 快捷键优化的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/523219

相关文章

CentOS和Ubuntu系统使用shell脚本创建用户和设置密码

《CentOS和Ubuntu系统使用shell脚本创建用户和设置密码》在Linux系统中,你可以使用useradd命令来创建新用户,使用echo和chpasswd命令来设置密码,本文写了一个shell... 在linux系统中,你可以使用useradd命令来创建新用户,使用echo和chpasswd命令来设

redis中使用lua脚本的原理与基本使用详解

《redis中使用lua脚本的原理与基本使用详解》在Redis中使用Lua脚本可以实现原子性操作、减少网络开销以及提高执行效率,下面小编就来和大家详细介绍一下在redis中使用lua脚本的原理... 目录Redis 执行 Lua 脚本的原理基本使用方法使用EVAL命令执行 Lua 脚本使用EVALSHA命令

Java Stream流使用案例深入详解

《JavaStream流使用案例深入详解》:本文主要介绍JavaStream流使用案例详解,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录前言1. Lambda1.1 语法1.2 没参数只有一条语句或者多条语句1.3 一个参数只有一条语句或者多

springboot使用Scheduling实现动态增删启停定时任务教程

《springboot使用Scheduling实现动态增删启停定时任务教程》:本文主要介绍springboot使用Scheduling实现动态增删启停定时任务教程,具有很好的参考价值,希望对大家有... 目录1、配置定时任务需要的线程池2、创建ScheduledFuture的包装类3、注册定时任务,增加、删

MySQL 中的 JSON 查询案例详解

《MySQL中的JSON查询案例详解》:本文主要介绍MySQL的JSON查询的相关知识,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录mysql 的 jsON 路径格式基本结构路径组件详解特殊语法元素实际示例简单路径复杂路径简写操作符注意MySQL 的 J

Python Transformers库(NLP处理库)案例代码讲解

《PythonTransformers库(NLP处理库)案例代码讲解》本文介绍transformers库的全面讲解,包含基础知识、高级用法、案例代码及学习路径,内容经过组织,适合不同阶段的学习者,对... 目录一、基础知识1. Transformers 库简介2. 安装与环境配置3. 快速上手示例二、核心模

如何为Yarn配置国内源的详细教程

《如何为Yarn配置国内源的详细教程》在使用Yarn进行项目开发时,由于网络原因,直接使用官方源可能会导致下载速度慢或连接失败,配置国内源可以显著提高包的下载速度和稳定性,本文将详细介绍如何为Yarn... 目录一、查询当前使用的镜像源二、设置国内源1. 设置为淘宝镜像源2. 设置为其他国内源三、还原为官方

Maven的使用和配置国内源的保姆级教程

《Maven的使用和配置国内源的保姆级教程》Maven是⼀个项目管理工具,基于POM(ProjectObjectModel,项目对象模型)的概念,Maven可以通过一小段描述信息来管理项目的构建,报告... 目录1. 什么是Maven?2.创建⼀个Maven项目3.Maven 核心功能4.使用Maven H

MySQL索引的优化之LIKE模糊查询功能实现

《MySQL索引的优化之LIKE模糊查询功能实现》:本文主要介绍MySQL索引的优化之LIKE模糊查询功能实现,本文通过示例代码给大家介绍的非常详细,感兴趣的朋友一起看看吧... 目录一、前缀匹配优化二、后缀匹配优化三、中间匹配优化四、覆盖索引优化五、减少查询范围六、避免通配符开头七、使用外部搜索引擎八、分

Java使用ANTLR4对Lua脚本语法校验详解

《Java使用ANTLR4对Lua脚本语法校验详解》ANTLR是一个强大的解析器生成器,用于读取、处理、执行或翻译结构化文本或二进制文件,下面就跟随小编一起看看Java如何使用ANTLR4对Lua脚本... 目录什么是ANTLR?第一个例子ANTLR4 的工作流程Lua脚本语法校验准备一个Lua Gramm