Listen for Page Load

by 3 contributors:
To follow this tutorial you'll need to have learned the basics of jpm.

You can get notifications about new pages loading using the tabs module. The following add-on listens to the tab's built-in ready event and just logs the URL of each tab as the user loads it:

require("sdk/tabs").on("ready", logURL);
 
function logURL(tab) {
  console.log(tab.url);
}

You don't get direct access to any content hosted in the tab.

To access tab content you need to attach a script to the tab using tab.attach(). This add-on attaches a script to all open tabs. The script adds a red border to the tab's document:

require("sdk/tabs").on("ready", runScript);
 
function runScript(tab) {
  tab.attach({
    contentScript: "if (document.body) document.body.style.border = '5px solid red';"
  });
}

(This example is only to show the idea: to implement something like this, you should instead use page-mod, and specify "*" as the match-pattern.)

Learning More

To learn more about working with tabs in the SDK, see the tabs API reference. You can listen for a number of other tab events, including open, close, and activate.

To learn more about running scripts in tabs, see the tutorial on using tab.attach().

Document Tags and Contributors

Tags: 
Contributors to this page: wbamberg, hgezim, tomica
Last updated by: wbamberg,
Hide Sidebar