动态生成select下拉框,遍历两个不同的数组,一个作为Value,一个作为展示选项
时间: 2024-03-27 18:37:33 浏览: 48
jQuery动态产生select option下拉列表
好的,您可以使用以下示例代码动态生成 select 下拉框:
```html
<select id="mySelect"></select>
<script>
const values = ["value1", "value2", "value3"]; // 数组1作为Value
const options = ["option1", "option2", "option3"]; // 数组2作为展示选项
const select = document.getElementById("mySelect"); // 获取 select 元素
// 遍历数组,动态生成 option 元素,并添加到 select 元素中
for (let i = 0; i < values.length; i++) {
const option = document.createElement("option");
option.value = values[i];
option.text = options[i];
select.add(option);
}
</script>
```
这段代码会生成一个 id 为 "mySelect" 的 select 下拉框,并使用数组 values 作为 option 的 value,使用数组 options 作为 option 的展示选项。您可以根据自己的需求修改数组内容和 select 的 id。
阅读全文