Javascript 使用jQuery将select中的选项存储在JSON/Array/Object中

我希望在以下方面得到一些帮助：

{
    option {
         label: 'Main Option 1',
         items: ['Sub Option 1', 'Sub Option 2']
    },
    option: {
        label: 'Main Option 2',
        items: ['Sub Option 1', 'Sub Option 2', 'Sub Option 3', 'Sub Option 4']
    },
    option: {
        label: 'Main Option 3',
        items: ['Sub Option 1', 'Sub Option 2']
    }
}

所以，我的HTML结构中有这个（通过WordPress生成）

等等，我们可以隐藏选择按钮，并且只有子选项作为按钮可用，标签作为标题

例如：

<h2>Main Option 1</h2>
<div class="button">Sub Option 1</div>
<div class="button">Sub Option 2</div>

<h2>Main Option 2</h2>
<div class="button">Sub Option 1</div>
<div class="button">Sub Option 2</div>
<div class="button">Sub Option 3</div>
<div class="button">Sub Option 2</div>

主要选择1
次级方案1
次级选择2
主要选择2
次级方案1
次级选择2
次级选择3
次级选择2

我对管理输出很有信心，但我似乎不知道如何或最好的存储方式

有人能帮我吗？我对jQuery一点也不陌生，但对自己创建JS对象却相当陌生

---

感谢各位

您可以在您的选择中迭代每个

0级

选项，将其文本添加为标签，将其同级

1级

选项文本作为项目添加到对象中。然后，您可以将这些对象推送到阵列以生成所需的结构：

let options=[]；
$（'.items option.level-0'）。每个（函数{
let label=$（el.text（）；
设项目=[]；
el=$（el.next（）；
while（el.length&&el.attr（'class'）.split（/\s+/）.includes（'level-1'））{
items.push（el.text（））；
el=el.next（）；
}
选项。推({
标签，
项目
});
});
console.log（选项）

各类员工
主要选择1
次级方案1
次级选择2
主要选择2
次级方案1
次级选择2
次级选择3
次级选择4
主要选择3
次级方案1
次级选择2
太棒了，非常感谢，尼克！快速提问，函数后面的“u”的作用是什么（？再次感谢！@fish\r不用担心，我很高兴能帮上忙。
\uu
通常用于表示正在设置但未使用的变量（在本例中，jQuery
回调的第一个参数。每个
都是元素的索引，但代码不需要该值）。

<h2>Main Option 1</h2>
<div class="button">Sub Option 1</div>
<div class="button">Sub Option 2</div>

<h2>Main Option 2</h2>
<div class="button">Sub Option 1</div>
<div class="button">Sub Option 2</div>
<div class="button">Sub Option 3</div>
<div class="button">Sub Option 2</div>