Tampermonkey是一款非常流行的用户脚本管理器,它可以让你在网站上添加自己的JavaScript脚本。这篇文章将会从多个方面对Tampermonkey脚本进行详细阐述,从而让读者更好、更全面地了解Tampermonkey的使用。
一、脚本管理
当你在Tampermonkey中保存了很多脚本后,如何方便地管理它们?Tampermonkey提供了多种方式进行脚本管理。
首先,在UI界面上,Tampermonkey会将你的脚本按照不同的类别分别管理。比如说,你可以在“Installed”栏中查看目前已经安装好的脚本;在“Editor”栏中进行代码编辑;在“Setting”栏中进行Tampermonkey设置。
其次,在脚本本身的编辑页面,你可以通过点击头部的“Monkey”图标,再点击“Dashboard”来进入Tampermonkey总管理界面。在这里你可以看到所有已经安装好脚本的统计数据,包括安装日期、访问次数等等。
最后,在Tampermonkey的一级UI界面,也就是你在浏览器右上角看到的小脚本icon那里,点击进去就可以看到所有的脚本列表了。这里的列表支持多种排序方式,包括按照脚本名称、上次执行时间、访问次数等等。
二、自定义UI
如果网站提供的UI功能不能满足你的需求,那么该怎么办呢?Tampermonkey便给我们提供了这样一种可能——自定义UI。
所谓自定义UI,就是指在脚本里面可以执行HTML、CSS、JS等多种前端代码,从而达到自定义UI的效果。比如说,当你浏览一个网站的时候,希望隐藏它的大量广告信息,便可以使用以下脚本:
// ==UserScript== // @name Hide ads // @namespace http://www.yourwebsite.com/ // @version 0.1 // @description Hide ads in the website // @author Your Name // @match http://www.example.com/* // @grant none // ==/UserScript== (function() { 'use strict'; var ad = document.getElementById("ad"); ad.parentNode.removeChild(ad); })();
上述脚本中,我们首先使用JavaScript获取了id为“ad”的DOM元素,然后再通过调用removeChild函数将其移除。这样一来,广告便被隐藏起来了。
三、脚本自动更新
如果你在Tampermonkey中保存了很多脚本,并且希望这些脚本可以自动更新,那么该怎么办呢?这里我们推荐一个非常好用的脚本——“Tapermonkey-Script-Updater”。
该脚本可以帮助我们自动更新Tampermonkey脚本。在使用之前,我们需要先安装它:
// ==UserScript== // @name Tampermonkey Script Updater // @version 1 // @description Update Tampermonkey scripts automatically // @match *://*/* // ==/UserScript== (function() { 'use strict'; var win = (typeof unsafeWindow != undefined ? unsafeWindow : window); var $ = win.jQuery; if (!$) { return console.log("no jQuery"); } $.fn.tampermonkey_script_updater = function(option) { var now = Date.now(); var defaults = { url: '', version: 0, lastUpdated: now }; //... }; })();
该脚本会自动检测Tampermonkey脚本的最新版本,并在检测到有更新时自动进行更新。通过使用它,我们就可以更方便地管理自己的Tampermonkey脚本了。
四、脚本的沙箱机制
在使用Tampermonkey脚本的过程中,有一个非常重要的安全措施——沙箱机制。
所谓沙箱机制,就是指Tampermonkey会在每个脚本的执行环境中创建一个沙箱。该沙箱只能在特定的限制下运行代码,以保护浏览器在运行过程中不受Tampermonkey脚本的影响。
以下是一个例子:
// ==UserScript== // @name MyScript // @description Example script // @run-at document-start // ==/UserScript== unsafeWindow.test = 'hello'; (function() { var test = 'world'; console.log(unsafeWindow.test); //输出 hello console.log(test) // 输出 world })();
上述脚本中,我们首先在全局作用域下创建了一个属性test,并将其设置为‘hello’。然后在所有代码执行之前,我们通过run-at选项将脚本运行在document-start这个时间戳下。接着,我们在立即执行函数中创建了一个变量test,其值为‘world’。最后,我们输出了全局作用域下的test和局部作用域下的test。令人惊奇的是,最终的输出结果分别为‘hello’和‘world’!这是因为,Tampermonkey在初始化的过程中会创建一个独立的沙箱来执行脚本,从而保证了漏洞的闭合和安全性。