如何从Firefox扩展中添加元素到网页 [英] How to add elements to web page from Firefox extension

问题描述

我打算开发一个Firefox扩展，它应该在加载的页面中放置一个按钮，当标记：< input type =file...> 被找到并且文件已被选中。

同样，我认为skype工具栏也会做类似的事情：当一个网站包含电话号码时，Skype扩展会自动把它转换成可以点击的按钮来调用Skype的联系人。

我在GNU / Linux系统上，不幸的是，skype扩展在Linux版本上不起作用Firefox / skype，所以我什至不能尝试反向工程任何东西...

firefox扩展包含文件overlay.js：该文件包含主要逻辑为扩展。在这里，我可以简单地用这个代码找到< input type =file...> 节点：

  onFileChosen：function（aEvent）{
 var input = aEvent.explicitOriginalTarget; 
 if（input.type ==file）{
 alert（input.value）; } 
 
 
 window.addEventListener（change，function（e）{xpitest.onFileChosen（e）}，false）;因此，当一个文件被选中时，会出现一个警告窗口并显示文件名。 
 
 
 
 $ b 
 p> 
 
 
但是，如何在文件被选择时在页面中放置一个按钮？ 
 
 
我已经尝试与各种document.parentNode和类似，但似乎没有任何工作。
 
 
或者是有可能我不能把东西放入加载页面？
 
 
 
谢谢 
 
解决方案
从chrome上下文，您可以获取当前内容文档（例如带有文件选择器的页面）使用top.window.content.document。在这一点上，就像你的JS在页面上运行一样。如果这样做没有帮助，请尽可能多地发布信息 。另请参见在Chrome代码中使用窗口。
 
 
 
而且你肯定可以注入东西到页面中。
 
I'm going to develop a Firefox extension which should put a button in the loaded pages, when the tag: <input type="file" ... > is found and a file has been selected.

Likewise, I think the skype toolbar does a similar thing: when a website contains a phone number, the Skype extension automatically converts it into a button that can be clicked to call skype contacts.

I'm on a GNU/Linux system, and unfortunately the skype extension does not work on Linux versions of Firefox/skype, so I can't even try to reverse engineer anything...

The firefox extension contains the file overlay.js: this file contains the main logic for the extension. Here I can find <input type="file" ... > nodes simply with this code:
onFileChosen: function(aEvent) {
var input = aEvent.explicitOriginalTarget; 
if(input.type=="file"){
    alert(input.value); }
}

window.addEventListener("change", function(e) {xpitest.onFileChosen(e)},false);
So, when a file has been chosen, an alert window appears and shows the file name.

But, how can I put a button in the page when a file has been chosen?

I've been trying with the various document.parentNode and similars, but nothing seems to work.

Or is it possible that I can't put stuff into the loaded page?

Thanks
解决方案
From the chrome context, you can get the current content document (e.g. the page with the file chooser) using top.window.content.document .  At that point, it's just like your JS is running on the page.  If that doesn't help, please post your code with as much info as possible.  See also Working with windows in chrome code.

And you definitely can inject things into the page.

                        
这篇关于如何从Firefox扩展中添加元素到网页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！