Question

我正在编写一个Firefox扩展（附加组件），允许用户使用文本和/或绘图注释任何页面，然后保存包含注释的页面图像。用例是客户审查网页，向页面添加反馈，保存图像并通过电子邮件将其发送回Web开发人员或测试人员获取带有GUI错误的注释截图等。

我在开发扩展程序之前在javascript中编写了注释/绘图功能。此脚本向要绘制的页面添加<canvas>元素以及包含用于不同绘图工具的按钮（每个<div>元素）的工具栏（在<canvas>中），例如行，框，椭圆，文本等。手动包含在页面中时，此工作正常。

我现在需要一种扩展方式：

将此脚本注入任何页面，包括我无法控制的页面。
当用户调用扩展时，可能会发生这种情况，这可能是在页面加载之后。
在此脚本中注入init()函数，添加画布和工具栏元素等需要以某种方式运行，但我无法确定如何从扩展名中调用它。

请注意，一旦注入，我不需要此脚本与扩展程序交互（因为当用户按下扩展程序chrome中的保存按钮时，扩展程序只会截取整个文档的屏幕截图（并删除添加的页面元素））。

Answer 1

这就是我通过设置onload属性来调用附加到页面的脚本中的init函数来解决我的问题的方法。

var myScript = top.window.content.document.createElement('script');
myScript.type = 'text/javascript';
myScript.setAttribute('src','chrome://path/to/script.js');
myScript.setAttribute('onload', 'firefoxInit()');
top.window.content.document.getElementsByTagName('head')[0].appendChild(myScript);

Answer 2

使用Greasemonkey extension：

允许您自定义网页的显示方式或行为方式   使用一小部分JavaScript。

已有数百个脚本，适用于各种热门网站   可在http://userscripts.org获得。

您也可以编写自己的脚本。查看   http://wiki.greasespot.net/开始使用。

如何从Firefox插件中将javascript注入页面并运行它？

2 个答案: