如何使用JavaScript向select标记添加选项？

我试图创建一个JavaScript，点击一个按钮，添加一个充满选项的标签。这些选项将由一个名为“花名册”的数组定义。我想看到的是一个下拉列表，可以选择桑切斯、罗纳尔多和厄齐尔

var花名册=[
“厄齐尔”，
“桑切斯”，
“罗纳尔多”
];
var reps=null；
var下拉菜单=null；
var scorerOption=“”+花名册[代表]+”；
函数makeDropdown（）{
dropdown=“”+字符串（记分法）。重复（花名册长度）+”；
document.getElementById（“rawr”）.innerHTML=下拉列表；
}

选择一名球员

您需要在数组中循环，对于数组中的每个元素，创建并插入一个新的

选项

您也不应该使用内联HTML事件处理属性（
onclick
），请参阅了解原因

最后，通常最好使用
document.createElement（）
的DOM API调用创建动态元素，而不是构建HTML字符串，因为字符串可能变得难以管理，并且DOM API提供了一种干净的面向对象方法来配置新创建的元素


var花名册=[
“厄齐尔”，
“桑切斯”，
“罗纳尔多”
];
//在JavaScript中使用DOM元素，而不是HTML
var btn=document.getElementById（“btn”）；
btn.addEventListener（“单击”，生成下拉菜单）；
函数makeDropdown（）{
//动态生成新元素作为内存中的对象
var list=document.createElement（“选择”）；
//为元素配置CSS类
list.classList.add（“记分员”）；
//在每个数组元素上循环
花名册（功能（项目）{
//动态创建和配置每个
var opt=document.createElement（“选项”）；
opt.classList.add（“scorerOption”）；
opt.textContent=项目；
//添加到
列表。附加子对象（opt）；
});
//将文件添加到文档中
document.getElementById（“rawr”）.appendChild（列表）；
}

选择一名球员

我很感激你的回答，但实际上我自己解决了这个问题。我只需要在将下拉列表转换为字符串后更新页面。从那以后，一切都解决了。@J.Smith很高兴这对您有帮助，但您应该知道您的解决方案效率很低，并且没有遵循最佳实践。