什麼是最好的方式來打開一個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頁面

回答

相關問題