Javascript 如何通过单击contextmenus和chrome extension，使用编程注入实现modalwindow

我正在尝试开发一个扩展，当用户单击右键单击菜单（上下文菜单）中的按钮时，该扩展将突出显示网页的选定文本

关于所选文本的信息也将从用户处获取，因为我试图使用编程注入的modalwindow，但无法执行脚本。代码中未显示任何错误。代码如下：

manifest.json

{
  "manifest_version": 2,
  "name": "web highlighter",
  "description": "save the content of the selected text",
  "version": "1.0",

 "background": {
    "page" : "background.html"
    },
 "icons": {
      "16": "icon.png",
      "48": "icon.png"
   },

  "minimum_chrome_version": "6",
  "content_scripts": [
        {
            "matches": [
                "<all_urls>"
            ],
           "js": [
             "background.js", "content_scripts.js"
            ]
        }
    ],
    "web_accessible_resources": [

    ],
  "permissions": [ "contextMenus", "tabs", "http://*/*" ]


}

content\u script.js

function get_modal(info,tab)
  {
     chrome.tabs.executeScript(null, {file: "content_scripts.js"});

   }

chrome.contextMenus.create({title: "Highlight %s with capsule", contexts:["selection"], onclick: get_modal})

iframeElement = document.createElement("iframe");
iframeElement.setAttribute("style","width: 100%; height: 100%;");

wrapperDiv.appendChild(iframeElement);

modalDialogParentDiv = document.createElement("div");
modalDialogParentDiv.setAttribute("style","position: absolute; width: 350px; border: 1px solid rgb(51, 102, 153); padding: 10px; background-color: rgb(255, 255, 255); z-index: 2001; overflow: auto; text-align: center; top: 149px; left: 497px;");

modalDialogSiblingDiv = document.createElement("div");

modalDialogTextDiv = document.createElement("div"); 
modalDialogTextDiv.setAttribute("style" , "text-align:center");

modalDialogTextSpan = document.createElement("span"); 
modalDialogText = document.createElement("strong"); 
modalDialogText.innerHTML = "web highlighter";

breakElement = document.createElement("br"); 
imageElement = document.createElement("img"); 
imageElement.src = chrome.extension.getURL("spinner_progress.gif");

modalDialogTextSpan.appendChild(modalDialogText);
modalDialogTextDiv.appendChild(modalDialogTextSpan);
modalDialogTextDiv.appendChild(breakElement);
modalDialogTextDiv.appendChild(breakElement);
modalDialogTextDiv.appendChild(imageElement);

modalDialogSiblingDiv.appendChild(modalDialogTextDiv);
modalDialogParentDiv.appendChild(modalDialogSiblingDiv);

document.body.appendChild(wrapperDiv);
document.body.appendChild(modalDialogParentDiv);

---

1. <未定义代码>包装器div。2.您正在加载

backgroundn.js

作为contentscript->

chrome.contextMenus==未定义的
和
content\u脚本。js
将永远不会被注入。您可以将
content\u scripts.js
作为contentscript加载。因此，您的wrapperDiv已经在
DOM\u IDLE
中被注入，假设为1。虽然您使用
executeScript
4在
background.js
中执行它，但它是固定的。因此，在每个contextMenu上单击，就可以将另一个
iframe
注入到DOM 5中。关于所选文本/位置的信息永远不会在contentscript中传递和/或使用。->页面上堆叠的浮动包装器div在用户单击contextmenu后，我应该如何修复它，因为我需要modalwindow（注入javascript）。
iframeElement = document.createElement("iframe");
iframeElement.setAttribute("style","width: 100%; height: 100%;");

wrapperDiv.appendChild(iframeElement);

modalDialogParentDiv = document.createElement("div");
modalDialogParentDiv.setAttribute("style","position: absolute; width: 350px; border: 1px solid rgb(51, 102, 153); padding: 10px; background-color: rgb(255, 255, 255); z-index: 2001; overflow: auto; text-align: center; top: 149px; left: 497px;");

modalDialogSiblingDiv = document.createElement("div");

modalDialogTextDiv = document.createElement("div"); 
modalDialogTextDiv.setAttribute("style" , "text-align:center");

modalDialogTextSpan = document.createElement("span"); 
modalDialogText = document.createElement("strong"); 
modalDialogText.innerHTML = "web highlighter";

breakElement = document.createElement("br"); 
imageElement = document.createElement("img"); 
imageElement.src = chrome.extension.getURL("spinner_progress.gif");

modalDialogTextSpan.appendChild(modalDialogText);
modalDialogTextDiv.appendChild(modalDialogTextSpan);
modalDialogTextDiv.appendChild(breakElement);
modalDialogTextDiv.appendChild(breakElement);
modalDialogTextDiv.appendChild(imageElement);

modalDialogSiblingDiv.appendChild(modalDialogTextDiv);
modalDialogParentDiv.appendChild(modalDialogSiblingDiv);

document.body.appendChild(wrapperDiv);
document.body.appendChild(modalDialogParentDiv);