
编写第二个油猴脚本,实现给greasyfork增加代码复制按钮
·
https://greasyfork.org/zh-CN/ 是用户脚本的大本营,上面有很多有用的脚本,但是其网站上的代码展示功能比较简陋,看起来挺费劲。如果能把代码复制出来,放到vscode等编辑器里看的话,会舒服很多。
greasyfork并没有提供代码复制功能,我们可以自己写个用户脚本来实现。在前文编写第一个油猴脚本,实现在公众号文章管理页按Ctrl+K将光标聚焦到搜索框中介绍了编写脚本的主要步骤,这里就直接上源码:
// ==UserScript==
// @name 给greasyfork增加代码复制按钮
// @namespace wbms
// @version 0.1
// @description 实现在greasyfork“安装此脚本”按钮后面增加一个“复制代码”按钮,点击时将代码复制到粘贴板
// @author cmdyu
// @match https://greasyfork.org/*/scripts/*/code
// @icon https://www.google.com/s2/favicons?sz=64&domain=greasyfork.org
// @grant GM_addElement
// @grant GM_setClipboard
// ==/UserScript==
(function () {
'use strict';
const installArea = document.querySelector("#install-area")
const btn = GM_addElement(installArea, 'button', {
textContent: '复制代码'
});
btn.onclick = function copyCode() {
const pre = document.querySelector(".code-container > pre")
GM_setClipboard(pre.innerText, "text", () => alert('复制成功'));
}
})();
和第一个脚本不同的是,这个脚本里用到了两个API,需要在脚本头部指令里开放一下权限,否则引用不到。
// @grant GM_addElement
// @grant GM_setClipboard
GM_addElement 用来添加按钮
GM_setClipboard 用来将代码内容复制到系统粘贴板
保存之后,就能在已安装的脚本里看到了。
再打开greasyfork脚本详情代码页,就会发现在“安装此脚本“按钮后面多了一个”复制代码“按钮。点击之后,就能将代码复制到粘贴板了。
欢迎关注微信公众号:文本魔术,了解更多
更多推荐
所有评论(0)