mozilla
您的搜索结果

    On page load

    本篇文章介绍了在扩展开发中,如何在浏览器或者邮件客户端中的页面加载完成时执行指定的代码.

    如果你需要更精确的控制特定代码的执行时刻:比如,当文档加载时,或者切换标签时,请查看Progress Listeners.

    创建一个overlay

    首先,你得为下面的某个XUL文档创建一个overlay

    应用程序 需要overlay的URI
    Firefox chrome://browser/content/browser.xul
    Thunderbird chrome://messenger/content/messenger.xul
    Navigator from SeaMonkey chrome://navigator/content/navigator.xul

    在overlay中添加脚本

    想要了解如何为你的overlay添加脚本,请查看 "Attaching a Script to an Overlay".

    下例中的代码为ID为"appcontent"的元素(Firefox,SeaMonkey)或者ID为"messagepane"的元素 (Thunderbird)添加了一个DOMContentLoaded事件监听函数.

    window.addEventListener("load", function load(event){
        window.removeEventListener("load", load, false); //取消监听,浏览器的load事件仅有一次.
        myExtension.init();  
    },false);
    
    var myExtension = {
      init: function() {
        var appcontent = document.getElementById("appcontent");   // Firefox,SeaMonkey
        if(appcontent){
          appcontent.addEventListener("DOMContentLoaded", myExtension.onPageLoad, true);
        }
        var messagepane = document.getElementById("messagepane"); // Thunderbird
        if(messagepane){
          messagepane.addEventListener("DOMContentLoaded", function(event) { myExtension.onPageLoad(event); }, true);
        }
      },
    
      onPageLoad: function(aEvent) {
        var doc = aEvent.originalTarget; // doc指向触发"DOMContentLoaded"事件的文档节点.
        if(doc.location.href.search("forum") > -1) { // 判断页面网址,只在特定的网址执行代码.
              alert("一个论坛页面加载完毕");
        }
        // 为页面添加unload事件监听函数.
        aEvent.originalTarget.defaultView.addEventListener("unload", function(event){ myExtension.onPageUnload(event); }, true);
      },
    
      onPageUnload: function(aEvent) {
        // 处理unload事件代码
      }
    };
    

    在Firefox当前的nightly版本中,除了xul:browser元素中的document节点会触发DOMContentLoaded事件之外, xul:images元素也会触发. 如果你想排除document之外的节点,使用条件表达式aEvent.originalTarget.nodeName == "#document" 来做判断.

    如果你想为页面的unload事件添加一些处理代码.你也可以使用appcontent元素的"pagehide"事件,如下:

    appcontent.addEventListener("pagehide", myExtension.onPageUnload, false);
    

    appcontent类似,messagepane是这样的:

    messagepane.addEventListener("pagehide", myExtension.onPageUnload, false);
    

    把你需要执行的代码添加到onPageUnload方法中.

    另一种绑定DOMContentLoaded事件的方法

    可以在全局变量gBrowser上绑定所需事件.推荐!

    var myExtension = {
        init: function() {
            if(gBrowser) {       
                  // 事件类型可以是DOMContentLoaded, pageshow, pagehide, load or unload等.
                  gBrowser.addEventListener("DOMContentLoaded", this.onPageLoad, false);
            }
        },
        onPageLoad: function(aEvent) {
            var doc = aEvent.originalTarget; // doc指向触发该事件的文档节点.
            var win = doc.defaultView; // win指向doc文档节点所在的窗口
            // if (doc.nodeName == "#document") return; // 只在文档节点时执行
            // if (win != win.top) return; // 跳过非顶层窗口.
            // if (win.frameElement) return; // 跳过iframes/frames框架.
            alert("页面已经加载 \n" +doc.location.href);
        }
    }
    window.addEventListener("load", function load(event){
        window.removeEventListener("load", load, false); //取消监听,load事件仅有一次.  
        myExtension.init();  
    },false);
    

    相关链接

    文档标签和贡献者

    此页面的贡献者有: ziyunfei
    最后编辑者: ziyunfei,