使用用户脚本定义数组时更改数组中的值

Question

我在本地地址http://127.0.0.1/menu.html 上的文件menu.html 中有一个看起来像这样的数组：

<script language='javascript'>
<!-- hide
var options = new Array('blue',
                           'a',
                           'm',
                           '1',
                           '1',
                           '0',
                           '1'
                          );

   // change value of blue to green before execution of the function below.

   createMenu(options);

// done hiding -->
    </script>

我想在使用greasemonkey 执行createMenu(options) 之前将blue 的值更改为green。

我尝试创建一个包含http://127.0.0.1/* 的新用户脚本

内容

// ==UserScript==
// @name        scriptname
// @namespace   namespace
// @description makes password blue
// @include     http://127.0.0.1/*
// @version     1
// @grant       none
// ==/UserScript==

unsafeWindow.options = new Array('green',
                               'a',
                               'm',
                               '1',
                               '1',
                               '0',
                               '1'
                              );

但是这段代码没有按预期工作。

有谁知道如何将数组options 中的值从blue 更改为green？

我正在使用unsafeWindow，因为我不关心这个用户脚本的安全性。

Answer 1

首先，有几点。你可以不用隐藏你的 JavaScript ——人们在几年前就这样编码，因为他们需要这样做。现在浏览器一般都可以识别 JavaScript，所以没有必要隐藏它。其次，如果你想在你的 GreaseMonkey 脚本中包含一个 JavaScript 文件，你需要把这个 JavaScript 放在它自己的 .js 文件中；包含 HTML 文件不会实现您的目标。因此，这是一种方法，您可以将 JavaScript 文件包含到 GreaseMonkey 脚本中，并将选项蓝色更改为绿色 在 CreateMenuOptions() 执行之前：

test_gm.js：

var options = new Array('blue',
                           'a',
                           'm',
                           '1',
                           '1',
                           '0',
                           '1'
                          );

function CreateMenuOptions(opts) {
  document.getElementsByTagName("body")[0].style.background = opts[0];
}

（GreaseMonkey）blue2green.user.js：

// ==UserScript==
// @name        Blue2Green
// @namespace   http://localhost/hayageek.com
// @include     *
// @version     1
// @grant       none
// @require     http://localhost/exp/test_gm.js
// ==/UserScript==

options[0] = "green";
CreateMenuOptions(options);

请注意，.js 文件包含在使用 @require 的 GreaseMonkey 脚本中。 @include 用于指定 .user.js 文件可以通过让 .user.js 文件本身执行并影响当前网页来扩充一个或多个网页的位置。

最后，还请注意，此策略不需要使用“unsafeWindow”，根据 GreaseMonkey 手册，这应该是最后的手段：API

Answer 2

tl;dr JSFiddle

您有三个选择。我将根据它们的 hacky 程度对它们进行排序，首先是最少 hacky 的解决方案：

1。覆盖createMenu()

这个很简单。

// Save old version of the function
var old_createMenu = window.createMenu;
window.createMenu = function(options) {
    // Change first value of the array
    options[0] = "green";
    // call the original function
    old_createMenu(options);
}

2。覆盖new Array()构造函数

仅在使用 new Array() 时有效，不适用于 [] 数组字面量！除非必要，否则我不建议这样做：

var oldArray = Array;
Array = function() {
    if(arguments.length>0 && arguments[0]=="blue") {
        arguments[0] = "green";
        // Put back old constructor
        Array = oldArray;
    }
    // create array of arguments which must be prepended with null
    var args = [];
    args.push.apply(args, arguments);
    args.unshift(null);
    return new (Function.prototype.bind.apply(oldArray, args));
}

3。在window.options 上设置二传手

仅在使用 window.options 时有效，不适用于 var options!

这里的想法是保护window.options，每当有人试图设置一个新数组时，修改它：

var options_secret = [];
Object.defineProperty(window, "options", {
    get: function() {return options_secret;},
    set: function(new_value) {
        if(new_value.length>0 && new_value[0]=="blue")
            new_value[0] = "green";
        options_secret = new_value;
    }
})