油猴入門使用

https://blog.csdn.net/weixin_42067967/article/details/105863853

油猴是一個(gè)瀏覽器拓展，用戶能添加腳本代碼來操作對(duì)應(yīng)網(wǎng)頁(yè)。

用戶腳本標(biāo)題

// ==UserScript==

// @name test

// @namespace http://tampermonkey.net

// @version 0.1

// @description try to take over the world!

// @author You

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

// @include https://www.zhihu.com/*

// @exclude https://www.zhihu.com

// @require https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js

// @grant unsafeWindow

// @grant GM_xmlhttpRequest

腳本的描述信息、需要引用的文件、接口等均可在此設(shè)定

@name :腳本的名稱

@namespace：腳本的名稱空間

@version：腳本版本

@auth：作者

@description：描述，簡(jiǎn)短的描述該腳本的功能，利于后續(xù)管理

@include、match：該腳本運(yùn)行于此頁(yè)面，可以明確指定一個(gè)url或使用通配符*來代替路徑中的部分字符

@exclude：排除url，即使已經(jīng)@include、@match也會(huì)排除

@require：腳本運(yùn)行前加載并執(zhí)行的js文件

@grant：用于引進(jìn)GM_*函數(shù)，unsafeWindow，這個(gè)對(duì)象可以獲取到網(wǎng)站中的一些變量和 JavaScript 函數(shù)

以上是常用的腳本標(biāo)題，想了解更多請(qǐng)查看Tampermonkey 文檔

應(yīng)用程序接口

GM_setValue(name, value)：

設(shè)置“name”的值到storage中

GM_getValue(name, defaultValue)：

從storage中獲取“name”的值，沒有則返回默認(rèn)值

GM_deleteValue(name)：

從storage中刪掉“name”

GM_addValueChangeListener(name, function(name, old_value, new_value, remote) {})：

監(jiān)聽storage中“name”值的改變，并返回偵聽器的id，remote為true表示在另一個(gè)標(biāo)簽頁(yè)中修改的，false則表示在當(dāng)前頁(yè)面修改的。

GM_removeValueChangeListener(listener_id)：

刪除對(duì)應(yīng)id的偵聽器

GM_openInTab(url, options), GM_openInTab(url, loadInBackground)：

打開標(biāo)簽頁(yè)，options對(duì)象有以下屬性:

active ：新標(biāo)簽頁(yè)獲得焦點(diǎn)

insert：新標(biāo)簽頁(yè)在當(dāng)前頁(yè)面之后添加

setParent：當(dāng)新標(biāo)簽頁(yè)關(guān)閉后，焦點(diǎn)給回當(dāng)前頁(yè)面

incognito: 新標(biāo)簽頁(yè)在隱身模式或私有模式窗口打開

loadInBackground 可以是 Boolean 類型，如果是 true，則當(dāng)前 tab 不變，如果是 false，則當(dāng)前 tab 變?yōu)樾麓蜷_的 tab

若只有一個(gè)參數(shù)則新標(biāo)簽頁(yè)不會(huì)聚焦，該函數(shù)返回一個(gè)對(duì)象，有close()、監(jiān)聽器onclosed和closed的標(biāo)記

GM_xmlhttpRequest(details)：

創(chuàng)建一個(gè)xmlhttpRequest，可以實(shí)現(xiàn)跨域請(qǐng)求，屬性：

method:

url:

headers:

onload :

......

例：

GM_xmlhttpRequest({

url:"",

method:'POST',

data:"",

onerror:function(res){

console.log(res);

},

onload:function(res){

console.log(res);

}

});

以上是部分應(yīng)用程序接口，具體請(qǐng)查看Tampermonkey 文檔

示例：（個(gè)人經(jīng)驗(yàn)）

在開發(fā)過程中有時(shí)候會(huì)遇到標(biāo)簽頁(yè)之間需要通信，這時(shí)GM的相關(guān)方法就起到了很好作用，可以通過它來實(shí)現(xiàn)標(biāo)簽頁(yè)之間互相監(jiān)聽動(dòng)態(tài)，這只是其中一種方法，使用可以看下面的案例：

該案例使用了GM_*來實(shí)現(xiàn)標(biāo)簽頁(yè)之間通信，在百度頁(yè)面打開知乎頁(yè)面，知乎頁(yè)面3秒后改變狀態(tài)，然后監(jiān)聽器監(jiān)聽到狀態(tài)改變后就關(guān)閉頁(yè)面，腳本如下：

// ==UserScript==

// @name test

// @namespace http://tampermonkey.net

// @version 0.1

// @description 通過GM_*實(shí)現(xiàn)標(biāo)簽頁(yè)間通信

// @author You

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

// @match https://www.zhihu.com/*

// @grant unsafeWindow

// @grant GM_setValue

// @grant GM_getValue

// @grant GM_openInTab

// @grant GM_addValueChangeListener

// ==/UserScript==

(function() {

'use strict';

var newTap;

//打開新頁(yè)面

var onpenNewTap = function (){

newTap = GM_openInTab("https://www.zhihu.com",{ active: true, setParent :true});

GM_setValue("newTapState", true);

};

//關(guān)閉頁(yè)面

var closeNewTap = function(){

newTap.close();

};

//監(jiān)聽新標(biāo)簽頁(yè)的狀態(tài)

var listenNewTap = function(){

GM_addValueChangeListener('newTapState', function(name, old_value, new_value, remote){

if(new_value == false){

closeNewTap();

}

})

};

var host = window.location.host

if(host.indexOf("baidu") > -1){

onpenNewTap();

listenNewTap();

} else if(host.indexOf("zhihu") > -1){

setTimeout(function(){

GM_setValue("newTapState", false);

}, 3 * 1000);

}

})();

這里使用GM_openInTab的方法打開新的頁(yè)面，當(dāng)然你也可以使用window.open

注意：

通過GM存儲(chǔ)的數(shù)據(jù)只能在同個(gè)油猴腳本下運(yùn)行的腳本才能互相讀取。若多個(gè)功能分腳本實(shí)現(xiàn)，可以在腳本標(biāo)題中通過require來引入。

總結(jié)

以上是生活随笔為你收集整理的油猴入门使用的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。