tampermonkey油猴+chrome,在浏览器中运行自己写的js脚本

前言

最近再看犀牛书《JavaScript权威指南》,当中的小例子我发现自己没法调试它zzz,于是就想到把它嵌入到浏览器里面,主要是使用的油猴再加上自己的js脚本

环境

tampermonkey v4.6 油猴
ubuntu 18
chrome

油猴添加脚本

tampermonkey油猴+chrome,在浏览器中运行自己写的js脚本_第1张图片
点击这边的添加脚本,然后在界面的脚本页面中输入自己的脚本代码,就可以了。

测试代码

// ==UserScript==
// @name         搜索参数显示
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  显示搜索的参数
// @author       You
// @include      https://www.baidu.com/*
// @grant        none
// ==/UserScript==

alert("Hello world");

function urlArgs() {
    var query = window.location.search.substring(1);
    console.log(query);
    var spArray = query.split("&");
    var args = {};
    for (var i = 0; i < spArray.length; i++) {
        var flag = spArray[i].indexOf("=");
        var key = spArray[i].substring(0, flag);
        var value = spArray[i].substring(flag + 1);
        value = decodeURIComponent(value);
        args[key] = value;
    }
    return args;
}

var result = urlArgs();
for (var key in result) {
    console.log("键: "+key+" 值: "+result[key]);
}

解释一下这边的@include 它的意思是在哪些网站上使用,我这里用的是百度,*代表通配符

效果

tampermonkey油猴+chrome,在浏览器中运行自己写的js脚本_第2张图片
从chrome的控制台中,我们可以看到自己的代码运行的结果,还是比较方便的

你可能感兴趣的:(JavaScript)