javascript - 我可以在 firefox 扩展中使用 page-mod 将 html 代码嵌入到网站中吗？

Question

您能否指出一个使用 page-mod 的示例，这样每次用户进入像 example.com 这样的网站时，除了页面的实际内容之外，还会有一些其他元素，例如 javascript 小部件？我正在为我的扩展使用附加构建器，因此 page-mod 模块似乎是解决这个问题的合乎逻辑的方法。非常感谢

Answer 1

如果您要嵌入的代码将作为您将其插入的网页的一部分正常运行，那么您只需使用类似于 documentation 中的第二个示例的代码。弗拉基米尔指出:

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

只需将必要的代码放在 contentScript 属性中，即可根据需要更改页面 DOM(例如，通过插入新的 JS 小部件)。

如果出于某种原因，小部件无法作为页面的一部分未经修改地运行，您将需要使用工作程序。例如，假设它必须从另一个网站提取数据，这将违反跨站点源策略。在这种情况下，将代码放入您的工作人员中以从该网站获取数据。并在您的内容脚本中使用消息向工作人员请求数据。