获取当前页面的 html

Question

我正在使用 jetpack（带有 node.js 的 jpm）创建一个 Firefox 插件，以扩展 Firefox 开发人员工具以允许编辑当前页面的 html。（我知道这个功能已经存在；只是想了解一下诀窍）。

我用什么API来访问当前页面的HTML？我看到有一个 Debugger.Source 但我不确定这是否正确。如果是这样，我该如何检索这些数据？

Answer 1

无法通过SDK直接访问，但可以使用content scripts读取和修改页面。

Answer 2

如第一个答案所示，您可以使用注入页面的内容脚本获取 html 源。例如，这是一个非常简单的方法，它使用选项卡模块将内容脚本附加到当前页面：

const self = require('sdk/self');
const tabs = require('sdk/tabs');

let { ActionButton } = require("sdk/ui/button/action");

let button = ActionButton({
  id: "my-button-id",
  label: "Get HTML Source",
  icon: {
    "16": "chrome://mozapps/skin/extensions/extensionGeneric.png",
    "32": "chrome://mozapps/skin/extensions/extensionGeneric.png"
  },
  onClick: (state) => {
    let worker = tabs.activeTab.attach({
      contentScript: 'self.port.emit("htmlSrc", {head: document.head.outerHTML, body: document.body.outerHTML});'
    });
    worker.port.on('htmlSrc', (result) => {
      worker.destroy(); // clean up
      let src = "<html>\n"+ result.head + "\n" + result.body + "\n</html>";
      require('sdk/clipboard').set(src, 'text');
    });
  }
});

获取当前页面的 html

Getting html of current page

firefox

firefox-addon

firefox-addon-sdk