从 Firefox 附加组件打开 html 页面的最佳方式是什么

What's the best way to open an html page from a Firefox Add-On

我正在构建一个 Firefox 附加组件,我需要在设置页面中使用一个按钮来打开一个包含附加组件存储的单词列表的页面。执行此操作的最佳方法是什么?

我想到了这个:

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 字符串内部看起来很糟糕。有什么建议吗?

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

如果您在后台页面中,或者您的问题中未说明内容脚本。假设您是从后台页面执行此操作,您可以按照 中的信息打开 results.html。该答案提供了用于在当前选项卡、新选项卡或新 window.

中打开页面的代码