js 使用document.createElement(“select”) 建立一個select後，添加多個optgroup和多個option

在JavaScript中，你可以通过`document.createElement("select")`创建一个新的 `<select>` 元素，然后使用DOM操作方法来动态地添加`<optgroup>`和`<option>`元素。下面是一个示例：

// 创建一个新的 select 元素
var selectElement = document.createElement("select");

// 添加一个 optgroup (分组)
var group1 = document.createElement("optgroup");
group1.label = "Category 1"; // 设置分组标题
var option1_1 = document.createElement("option");
option1_1.value = "item1";
option1_1.text = "Option 1.1";
group1.appendChild(option1_1);

var option1_2 = document.createElement("option");
option1_2.value = "item2";
option1_2.text = "Option 1.2";
group1.appendChild(option1_2);

selectElement.appendChild(group1); // 将分组添加到 select 中

// 可以继续添加另一个分组和选项
var group2 = document.createElement("optgroup");
group2.label = "Category 2";
var option2_1 = document.createElement("option");
option2_1.value = "item3";
option2_1.text = "Option 2.1";
group2.appendChild(option2_1);

selectElement.appendChild(group2); // 添加第二个分组

// 将 select 元素添加到文档中
document.body.appendChild(selectElement);

在这个例子中，我们首先创建了一个选择框，然后创建了两个分组(`optgroup`)并分别添加了一些选项(`option`)。最后，我们将选择框添加到了页面上。