什么是最好的方式来打开一个Firefox附加的HTML页面

我正在构建一个Firefox附加组件，我需要一个按钮，在设置页面打开一个页面的单词列表的添加 - 已存储。什么是最好的方法来做到这一点？什么是最好的方式来打开一个Firefox附加的HTML页面

我想出这个：

function ShowList() { 

// We get the array from the local storage. 

    function createList(item){ 
    var list = []; 
    // Get the stored list, if there's any. 
    if (item[0].list){ 
     list = item[0].list; 
    } 
    } 
    function onError(e) { 
    alert("Error:" + e); 
    } 
    browser.storage.local.get("list").then(createList, onError); 

// Once we have the list, build an HTML string with its contents 

    var listhtml = ['<!DOCTYPE html>', 
      '<html>', 
      ' <head>', 
      '  <meta charset="utf-8">', 
      ' </head>', 
      ' <body>', 
      '  <ul>'].join("\n"); 

    for (var w= 0; w < list.length ; w++) { 
    listhtml += '   <il>' + list[w][0] + '</il>\n'; 
    } 
    listhtml += ['  </ul>', 
     ' </body>', 
     '</html>'].join("\n"); 
    var oMyBlob = new Blob([listhtml], {type : 'text/html'}); // the blob 
    window.open(URL.createObjectURL(oMyBlob)); 
}

但HTML里面一个字符串看起来很可怕。有什么建议么？

来源

2016-11-30 carllacan

你在做什么[Firefox扩展]（https://developer.mozilla.org/en-US/Add-ons）（[WebExtensions]（https://developer.mozilla.org/en-US） /附加组件/ WebExtensions）[[tag：firefox-webextensions]]，[Add-on SDK]（https://developer.mozilla.org/en-US/Add-ons/SDK）[[tag：fiirefox- addon-sdk]]，[Bootstraped]（https://developer.mozilla.org/en-US/Add-ons/Bootstrapped_extensions）[[tag：firefox-addon-restartless]]或[Overlay/XUL/Legacy] （https://developer.mozilla.org/en-US/Add-ons/Overlay_Extensions）[[tag：fiirefox-addon-overlay]]/[[tag：xul]]）？请在您的问题中编辑适当的标签。 – Makyen

它似乎是一个WebExtension。如果是这样，请添加适当的标签。 – Makyen

请将[问题]置于主题上：包括一个重复问题的**完整** [mcve]。包括一个* manifest.json *，一些背景*和*内容脚本。寻求调试帮助的问题（“**为什么不是这个代码工作？”）必须包括：►期望的行为，►特定问题或错误*和*►在问题中重现问题所需的最短代码**本身**。没有明确问题陈述的问题对其他读者无益。请参阅：“**如何创建[mcve] **”，[我可以在此处询问哪些主题？]（http://stackoverflow.com/help/on-topic）和[问]。 – Makyen

通常，您的扩展目录中会有一个结果页面（例如results.html）。这将有基本的HTML框架和页面的任何包含的CSS和脚本。然后，您可以在页面打开后动态修改该页面的DOM。

如果您处于后台页面，或者您的问题中未说明内容脚本。假设您是从后台页面执行此操作，则可以按照Show HTML file contained within the extension中的信息打开results.html。该答案提供了在当前选项卡，新选项卡或新窗口中打开页面的代码。

来源

2016-11-30 20:38:07 Makyen

“如果您处于后台页面，或者您的问题中未说明内容脚本”，我在选项页面中。据我所知，它与背景页面或内容脚本不同，不是吗？ – carllacan

谢谢，这比在一个字符串中包含HTML块更加优雅。但是，如何让结果页面显示存储列表？我试着从results.html javascript访问存储列表，但它不起作用。我应该得到新标签的ID，连接到它，然后在JSON中传递列表？ – carllacan

@carllacan，一个选项页面（* manifest.json *中的'options_ui'）和'browser_action'弹出窗口与背景页面处于相同的上下文中。虽然他们通常专注于特定任务，但他们可以像访问后台页面一样访问Chrome API。因此，上面的代码将起作用。至于你的第二个问题，回答我需要更多的信息。一个问题是，如果您正在构建结果的信息位于内容或后台脚本中。坦率地说，这个问题已经足够大了，它确实应该是[mcve]的[新问题]（http://stackoverflow.com/questions/ask）。 – Makyen

什么是最好的方式来打开一个Firefox附加的HTML页面

回答

相关问题