javascript - 如何在不使用sdk的情况下将html显示为firefox面板

Question

我需要在我的 firefox 插件中使用 javascript 将 html 元素显示为弹出面板的内容。

使用 SDK 显示弹出窗口是我正在寻找的，但我不想使用 SDK。

面板:

<popupset id="mainPopupSet">
    <panel id="htmlPanel" type="arrow">
        i want to use html elements like p,div,span, etc here.
    </panel>
</popupset> 

用 JavaScript 打开面板:

document.getElementById('htmlPanel').innerHTML = 'my custom contents';
document.getElementById('htmlPanel').openPopup(null, "before_start", 0, 0, false, false);

似乎有些元素是允许的，但行为不同!我还需要为面板内的元素设置 CSS。

Answer 1

我弄清楚如何使用iframe来做到这一点

将 XUL 更改如下:

<popupset id="mainPopupSet">
    <panel id="htmlPanel" type="arrow">
        <html:iframe id="htmlContainer"/>
    </panel>
</popupset> 

并创建一个 JavaScript 函数来设置 html 内容:

function setupPanel(contents, width, height)
{
    var iframe = document.getElementById("htmlContainer");
    iframe.setAttribute("src","data:text/html;charset=utf-8," + escape(contents));
    iframe.width = width || 300; //default width=300
    iframe.height = height || 300; //default height=300
}

和用法:

setupPanel("<p>this is raw HTML.</p>");
document.getElementById('htmlPanel').openPopup(null, "before_start", 0, 0, false, false);

感谢您的提示。