Question

是否可以在将页面导航到使用Bootstrapped加载项之前为文档添加事件侦听器？我希望看到用户想要导航到的页面以及页面加载后检查DOM的页面。我需要在HTML内容上下文中运行代码。

过去我使用了工具栏XUL并在其中包含了javascript，它会在加载HTML页面之前加载。

Answer 1

我在之前的DOMContentLoaded之前研究了一些东西，发现有一个文件插入了观察者。

在底部运行研究代码后的事件顺序

readystate更改为interactive（我认为多次，不确定）
readystate更改为complete
DOMContentLoaded事件触发
load事件触发（如果您可能需要将addEventListener更改为捕获行为（第三个参数）为false或true，则有时加载不会触发）

显然在所有这一切之前应该有readystate loading，但我永远无法抓住它，我不知道为什么。

在暂存器中运行代码后，浏览器当然是environemnt，然后加载新页面并观察错误控制台，它将按此顺序抛出这些报告：

ready state changed! ("interactive") Scratchpad/4:18
02:28:07.873 ready state changed! ("complete") Scratchpad/4:18
02:28:07.874 DOMContentLoaded event fired! Scratchpad/4:53
02:28:07.938 Load event fired! Scratchpad/4:45

这是研究代码。它增加了一个听众和观察者，看看是什么射击。

var {classes: Cc, interfaces: Ci, utils: Cu} = Components;
var os = Cc['@mozilla.org/observer-service;1'].getService(Ci.nsIObserverService);
var LMObserver;

function myObserver() {
  this.register();
}

myObserver.prototype = {
    observe: function (subject, topic, data) {
        //Cu.reportError(subject);
        //Cu.reportError(data);
        //i think subject is window element
        subject.onreadystatechange = function () {
            //loading
            //interactive
            //complete
            Cu.reportError('ready state changed! ("' + subject.readyState + '")');
            //var body = subject.documentElement.querySelector('body')
//you want to change title so you would do that here do something like: if (subject.readystate == 'complete') { subject.title = 'blah blah' }
            //Cu.reportError('has body element: ' + body)
        }

    },
    register: function () {
        os.addObserver(this, 'document-element-inserted', false);
    },
    unregister: function () {
        os.removeObserver(this, 'document-element-inserted', false);
    }
};


//below this is the DOMContentLoaded thing i put this here so we can see what fires in what order
var pageLoad = function(event) {
    var win = event.originalTarget.defaultView;
    if (win && win.frameElement) {
      return;
    }
    Cu.reportError('Load event fired!');
}

var pageDOMContentLoaded = function(event) {
    var win = event.originalTarget.defaultView;
    if (win && win.frameElement) {
      return;
    }
    Cu.reportError('DOMContentLoaded event fired!');
}


LMObserver = new myObserver;
gBrowser.addEventListener("load", pageLoad, true);
gBrowser.addEventListener("DOMContentLoaded", pageDOMContentLoaded, true);
//gBrowser.removeEventListener("load", pageLoad, true);
//gBrowser.removeEventListener("DOMContentLoaded", pageDOMContentLoaded, true);
//LMObserver.unregister();

以下对使用load或true作为捕获参数添加的false个事件进行了一些深入研究：https://github.com/Noitidart/event-listener-experiment-DOMC-and-load/blob/master/bootstrap.js

Firefox Bootstrapped Add-On加载前注入

1 个答案: