移动 Firefox (Fennec) 插件：在页面加载时执行代码答案

【问题标题】：Mobile Firefox (Fennec) add-on: executing code on page loads移动 Firefox (Fennec) 插件：在页面加载时执行代码
【发布时间】：2011-07-14 14:48:13
【问题描述】：

我正在尝试编写一个移动 Firefox 插件，该插件在每次页面加载时自动执行一段 javascript 代码。我为早期版本的 Fennec 编写了一些代码，但是在较新的 Fennec 版本（https://wiki.mozilla.org/Mobile/Fennec/Extensions/Electrolysis/）中使用多处理系统，此代码必须是移植。我以http://people.mozilla.com/~mfinkle/tutorials/ 的教程为基础，以获得一个可以在浏览器菜单中选择一个选项时执行一段代码的版本。该方案由两部分组成，分别是overlay.js（用于主（应用程序）进程）和content.js（用于子（内容）进程）。 Overlay.js 在overlay.xul 中加载，而content.js 通过overlay.js 中的以下代码为新标签加载：

window.messageManager.loadFrameScript("chrome://coin/content/content.js", true);

只要单击浏览器菜单中的选项，overlay.js 中的代码就会向 content.js 发送一条消息，然后正确执行所需的代码（一些脚本标签只是简单地添加到页面头部）。但是，我不知道如何在页面加载时自动执行代码。我在 content.js 中尝试了以下内容：

function addCoin(aMessage) { ... }

// this executes the desired code every time an option is clicked in the browser menu
addMessageListener("coin:addCoin", addCoin);

// this attempts to execute the code on every page load; i.e., after this script has     
been loaded for the new tab
addCoin(null);

然而，最后一条语句没有效果。然后，我尝试在末尾添加以下语句：

sendAsyncMessage("coin:scriptLoaded", { });

此语句向 overlay.js 脚本发送一条消息，该脚本为该消息注册一个侦听器，并作为响应仅发送与单击浏览器菜单中的选项时相同的消息，即“coin:addCoin”。但是，这也不起作用。最后，我尝试查找 overlay.js 脚本可以侦听的某些事件（例如“tabOpened”之类的），但找不到任何东西。

有没有人知道如何在每次页面加载时自动执行代码？

问候，

威廉

【问题讨论】：

标签： mobile firefox-addon fennec

【解决方案1】：

在您的 content.js 脚本中，您可以简单地为“加载”事件注册一个事件侦听器，就像在旧的单进程 Firefox 中一样：

addEventListener("load", someFunc, true);

只要网页在标签页中加载，这将调用“someFunc”。

content.js 中的任何全局代码都是在初始创建选项卡时执行的，而不是在页面加载时执行的。使用全局代码设置事件监听器或消息监听器。 Web 内容仍会触发您可以在 content.js（子脚本）中捕获的事件。

【讨论】：

您好，马克，感谢您的快速回复（以及您的教程！:)。在发布我的问题后，我在 content.js 中尝试过类似的东西，尝试 addEventListener （使用“load”和“DOMContentLoaded”），然后在内容、content.document、content.windowRoot 之前添加......由于某种原因，没有它就无法工作“true”参数（不知道为什么）。所以，它现在可以工作了，非常感谢！
content.addEventListener(...) 适用于某些事件，但诀窍是在“内容”对象有效且尚未触发您要侦听的事件时设置事件侦听器. “内容”是网页的 DOM 窗口，因此它会随着新页面的加载而改变。对 addEventListener 使用全局对象意味着监听器始终可用，使用“true”意味着事件被捕获，即使它自己没有冒泡。并非所有 DOM 事件都需要“true”，因为它们已经冒泡了。
好的，我知道事情变得越来越清楚了 :) 再次感谢。

【解决方案2】：

这对我有用。

在content.js:

var addEventListener;

if (window.BrowserApp) { // We are running in Mobile Firefox
    addEventListener = window.BrowserApp.deck.addEventListener;
} else {
    var appcontent = document.getElementById("appcontent");
    if (appcontent) {
        addEventListener = appcontent.addEventListener;
    }
}

if (addEventListener) {

    var onDOMContentLoaded = function() { /* Code here */ };
    addEventListener("DOMContentLoaded", onDOMContentLoaded, true);

    var onLoad = function() { /* Code here */ };
    addEventListener("load", onLoad, true);

    // etc ...
}

【讨论】：