Javascript 使用Greasemonkey添加工具栏？

我正在写一个Greasemonkey脚本，我想在我启用该脚本的每个网站的顶部添加一个工具栏，但我不确定如何使用JS实现这一点。我希望工具栏提供一个下拉列表，对于下拉列表的每个选项，它会对启用的网站执行不同的操作。任何其他实现此目的的方法都值得赞赏。 谢谢大家!

假设我将其作为.js文件：

var searchRE = new RegExp("red","gi"); 
var replace = 'blue'; 
for (var i=0;i<textNodes.snapshotLength;i++) { 
    var node = textNodes.snapshotItem(i); 
    node.data = node.data(searchRE, replace); 
} 

我应该把document.createElement。。。在这里谢谢大家!

我看不出需要RegExp，如果我理解正确，您不需要更多：

// ==UserScript==
// @name       Test
// @version    0.1
// @description  Some useful description
// @match      https://www.your.site/*
// @resource html file:///C:/Users/User/Desktop/Test.html
// ==/UserScript==

var myDiv = document.createElement("div");
var myHTML = GM_getResourceText("html");
myDiv.innerHTML = myHTML;
document.body.appendChild(myDiv);

@resource引用的文件是您制作工具栏的html文件。您还可以@require您自己的CSS文件，这样您的html就不需要在每个标记中包含样式规则

这样做的目的是读取本地文件，并将其放入正文中的一个新div中。 您也可以使用javascript制作整个html，但这是一个漫长而乏味的过程，出错的风险更高

注

---

有些网站出于某种原因不喜欢这种方法，而是将其放入一个隐藏的iframe中，这使得它看起来有点难。我在几个网站上测试了这个方法，在基本网站上，这个方法应该有效

document.createElement，然后从那里开始…我可以将其添加到我的.js文件中吗..？Greasemonkey基本上只是在页面上以提升的权限运行的javascript，创建您的元素、样式，然后附加到正文中。您能告诉我如何做到这一点吗？假设我将其作为.js文件：var searchRE=new RegExpred，gi；var replace=‘蓝色’；对于var i=0；我