javascript - 从 Chrome 扩展修改表的 insertRow

Question

我正在尝试从 Chrome 扩展程序修改表的 insertRow 函数。

oldInsRowFunc = document.getElementById(id).insertRow;
document.getElementById(id).insertRow = fakeInsertRow;
// .......
function fakeInsertRow (ind) {
    alert("fakeInsertRow called");
}

但是当它被调用时，调用的是 native 函数，而不是 fakeInsertRow。在其他情况下，如果我在 javascript 控制台中使用相同的代码 - 一切正常。

Answer 1

这不起作用的原因是 Chrome 扩展程序添加的 JavaScript(通常在内容脚本中)是在其自己的沙箱中执行的，该沙箱无法访问页面加载的 JavaScript 环境。

以下是来自 Chrome Extension 的 JavaScript 限制:

Here are some examples of what content scripts can do:
   * Find unlinked URLs in web pages and convert them into hyperlinks
   * Increase the font size to make text more legible
   * Find and process microformat data in the DOM

However, content scripts have some limitations. They cannot:
   * Use chrome.* APIs (except for parts of chrome.extension)
   * Use variables or functions defined by their extension's pages
   * Use variables or functions defined by web pages or by other content scripts

如果您的目标是真正包装/覆盖 native JavaScript/DOM 访问方法(哎呀，似乎很糟糕)，那么在页面上下文中执行 JavaScript 的一种方法是创建一个外部托管的 JavaScript 文件，然后使用Chrome 扩展程序将 script 元素添加到引用外部托管文件的页面 DOM。以这种方式插入的 JavaScript 将在页面 JavaScript 环境中运行(这意味着 Chrome 扩展程序将无法使用它)。

Chrome 扩展 JavaScript 类似于:

document.body.appendChild(document.createElement("script")).src = "http://externally/hosted/javascript.js";

那么位于 http://externally/hosted/javascript.js 的文件中的 JavaScript 代码可能就是您上面的代码。