Как создать вкладку (XUL) в Javascript

Question

Я разрабатываю расширение Firefox и пытаюсь добавить панель вкладок во вкладку (xul).

Вкладка:

<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");

Вкладка появляется, но страница вкладки пуста, я пытался:

1. использовать appendItem со вторым параметром => не работать
2. document.getElementById ("tbDashboard") ["табулатуры"]. AppendItem (...) => fail

У кого-то есть идея создать вкладку (панель вкладок) ??

ТНХ

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, например ::100100

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