如何通过Firefox扩展/附加组件将按钮添加到任何网站？

Question

我想创建一个扩展来搜索页面上的元素，找到一个特定的元素（例如Facebook之类的按钮），并在其旁边添加我自己的按钮。 这可能吗？如果可以，我该如何实施呢？

更新：因此，我尝试实现要使用的功能：

onPageLoad: function(aEvent) {
    var doc = aEvent.originalTarget; // doc is document that triggered "onload" event

    var fblike = document.getElementsByTagName("fb-root");
    var button = top.window.content.document.createElement("input");
    button.setAttribute("type", "button");
    button.setAttribute("value", "valore");
    button.setAttribute("name", "nome");
    var parentDiv = fblike.parentNode;
    parentDiv.insertBefore(button, fblike);
    alert(button);
},

我仍然无法获得该按钮甚至无法显示在页面上。 无论如何，有没有让该按钮显示在整个页面顶部的按钮，所以我知道问题出在找'fb-root'标签吗？ 我正在尝试检测Facebook之类的按钮。

Answer 1

用Javascript在页面上查找特定元素非常简单-如果元素具有自己的id则只需使用document.getElementById(someId) 。 向DOM添加元素也同样容易（使用jQuery之类的框架，这一切都变得更加容易）。 但是，恐怕我没有编写浏览器扩展的经验。 但是我可以告诉你，这绝对是可能的。 :)

Answer 2

处理页面的文档时，应始终保持一致-请勿使用document因为这将引用您在其中运行的文档（通常是浏览器窗口）。 您还应该确保在将要插入该节点的同一文档中创建该节点（并且不要忘记检查错误控制台，这时您应该能够说出比“不起作用”更具区别性的内容）。 您的代码已修正错误：

var fblike = doc.getElementsByTagName("fb-root");
var button = doc.createElement("input");
button.setAttribute("type", "button");
button.setAttribute("value", "valore");
button.setAttribute("name", "nome");
var parentDiv = fblike.parentNode;
parentDiv.insertBefore(button, fblike);