Can I embed html code into a website using page-mod, in a firefox extension?

Could you point me towar开发者_如何学JAVAds an example of using page-mod so every time a user enters a website like example.com, alongside the actual content of the page, there would be also some other elements such as a javascript widget? I'm using the add-on builder for my extension so the page-mod module seems the logical way to solve this. Thanks a lot

If the code you want to embed will run properly as part of the webpage you are inserting it into, then you just have to use code like the second example in the documentation Wladimir pointed to:

var pageMod = require("page-mod");
pageMod.PageMod({
  include: "*.org",
  contentScriptWhen: 'end',
  contentScript: 'document.body.innerHTML = ' +
                 ' "<h1>Page matches ruleset</h1>";'
});

Just put the necessary code in the contentScript property to change the page DOM in whichever want you want (e.g. by inserting a new JS widget).

If for some reason the widget can't run unmodified as part of the page, you'll need to use a worker. For example, let's say it has to pull down data from another website, which would violate cross-site origin policies. In that case, put the code to get the data from that website in your worker. and use messages to request the data from the worker in your content script.

On a tangent, if modifying a page is all you want to do, you could write a small greasemonkey script instead of creating a full extension.

https://addons.mozilla.org/en-US/firefox/addon/greasemonkey/