在 chrome 的控制台中添加自定义功能

Question

是否可以在 google-chrome 中拥有自定义功能，这些功能将始终在控制台中可用（无论加载什么页面）？例如，我想要一个名为 echo 的函数，它只是 console.log 的包装器。这只是节省了一些输入，但稍后我可能想创建一些有用的调试功能。

Answer 1

好吧，这很容易完成。您需要的是创建一个内容脚本。该脚本将被注入任何页面并创建一些您将在控制台中使用的必要全局函数。最具挑战性的部分是如何使这些自定义内容脚本函数成为您实际

window

对象的一部分，因为通常您无法从其他 javascript 代码访问您在内容脚本中定义的函数或变量，这不是在内容脚本中。内容脚本在所谓的隔离环境中运行。

内容脚本在称为隔离世界的特殊环境中执行。它们可以访问被注入页面的 DOM，但不能访问页面创建的任何 JavaScript 变量或函数。它会查看每个内容脚本，就好像在它运行的页面上没有其他 JavaScript 正在执行一样。反过来也是如此：在页面上运行的 JavaScript 不能调用任何函数或访问内容脚本定义的任何变量。

但是有一些奇特的解决方法。
您定义清单文件如下：

清单.json

{
    "name": "Content script",
    "version": "0.1",
    "manifest_version": 2,
    "content_scripts": [{
        "matches": ["http://*/*"],
        "js": ["console.js"]
    }]
}

你的内容脚本：

console.js

function customConsole() {
    window.myNewFunction = function() {
        console.log("Hello I'm available from console.");
    };
}

var script = document.createElement('script'),
    code   = document.createTextNode('(' + customConsole + ')();');
script.appendChild(code);
(document.body || document.head || document.documentElement).appendChild(script);

因此，您将新函数指定为全局函数，以便可以在

console

.
中使用它们 也看看这个post

Answer 2

今天，也许另一种方法是使用 Chrome 代码段。它们允许您存储可以多次重复使用的自定义代码。