如何使用javascript创建自定义窗口，而不是使用附加SDK创建面板

现在我正在开发一个firefox扩展，它可以根据网页动作显示一些javascript对话框

我有chrome扩展版代码，它运行良好。 它的主要工作流程是，当我单击扩展图标时，它会根据网页内容弹出一个特定的javascript对话框（使用）。因此，我发现在firefox插件中尝试做同样的事情对我来说很难。在chrome中，消息api简单易懂。但是在firefox插件中，我经常被页面修改、面板、工作等搞得一团糟

现在，我试着这样做：

• 当我点击firefox扩展图标时，它会向内容脚本发送一条消息（包括主html的src）

• 然后内容脚本中的相对方法使用消息弹出对话框（使用TINYBOX）

• 因此页面可以显示，但没有css和js（因为主html中的样式和js链接无效）。那么以前有人做过这种工作？或 给我一些提示，谢谢

试试这个：

Main.js[内容脚本]

var workers = [];
var widget = widgets.Widget({
     id: "my-link",
     label: "my-page",
     contentURL: self.data.url('mypage.ico')//,
     //emit the click event
     contentScript: 'self.port.emit('icon-click', 'icon clicked')'  
});

function detachWorker(worker, workerArray) {
   var index = workerArray.indexOf(worker);
   if(index != -1) {
       workerArray.splice(index, 1);
   }
}

var pageMod = require('sdk/page-mod').PageMod({
     include: ['https://my-page.com'],
     //pass the click event to page Script
     contentScript: 'self.port.on("icon-click", function()
           {document.defaultView.postMessage({ action:"icon-clicked", msg: "my message", "https://my-page.com"})
     })',
     onAttach: function(worker) {
         workers.push(worker); 
         worker.on('detach', function () {
               detachWorker(this, workers);
         });
     }
});

//pass event to worker's content script
widget.port.on('icon-click', function(){
    //use for each on workers
    worker[0].port.emit("icon-click", 'icon clicked');
});

现在，在页面脚本中侦听postMessage

window.addEventListener('message', function(event) {
     //include all the dialog libs/resources/css in page  
     var data = event.data;
      if(data.action === 'icon-clicked'){
       showDialog(data.msg);
      }

  }, false);

---

你可能会误解我的问题。我的观点是关于页面可以显示但没有css和js的最后一个页面（因为主html中的样式和js链接无效）。我无法正常导入本地html文件。