如何通過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);