Question

我开发了一个Firefox扩展程序，我尝试在tabbox（xul）中添加一个tabpanel。

标签栏：

<tabbox id="tbDashboard" selectedIndex="0" >
        <tabs><!-- list of tabs -->
            <tab label="Overview"/> <!-- default tab -->
            <tab label="test"/>
        </tabs>

        <tabpanels><!-- list of contents -->
            <tabpanel ><!-- default tab's content -->
                <box orient="horizontal" flex="1">
                    <description style="font-size: 24pt;">overview</description>
                </box>
            </tabpanel>
            <tabpanel ><!-- test tab's content -->
                <box orient="horizontal" flex="1">
                    <description style="font-size: 24pt;">test</description>
                </box>
            </tabpanel>
        </tabpanel>
    </tabpanels>
</tabbox>

我可以在JS中添加一个新选项卡：

document.getElementById("tbDashboard")["tabs"].appendItem("popo");

出现标签但标签页为空，我尝试：

使用appendItem和第二个参数=＆gt;不工作
document.getElementById（“tbDashboard”）[“tabpanels”]。appendItem（...）=＆gt;失败

有人有想法创建标签页（tabpanel）??

THX

Answer 1

tabs.appendItem()只是创建tab元素的方便助手。它基本上与：

相同

var tabbox = document.getElementById("tbDashboard");
var tab = document.createElement("tab");
tab.textContent = "popo";
tabbox.tabs.appendChild(tab);

您可以以相同的方式创建和添加tabpanel元素（此处仅显示文本框内容）：

var panel = document.createElement("tabpanel");
panel.appendChild(document.createElement("textbox"));
tabbox.tabpanels.appendChild(panel);

有关DOM操作的教程，请参阅https://developer.mozilla.org/en/XUL_Tutorial/Modifying_a_XUL_Interface。

Answer 2

您需要使用DOM API创建面板，然后将其附加到您的XUL文档，例如：

let newPanel = document.createElement("tabpanel");
let panelContent = document.createElement("hbox");
// Add more content here
newPanel.appendChild(panelContent);
document.getElementById("tbDashboard").tabPanels.appendChild(newPanel);

如何在Javascript中创建一个tabpanel（xul）

2 个答案: