javascript - Javascript for循环添加“n”个选项元素？

Question

我有一个动态生成的数字，我想将此数量的选项元素添加到选择中。我认为 for 循环将是做到这一点的最佳方式。假设我的包含数字的变量是 var number。谢谢你的帮助。

我的起始 HTML 是：

<select id="test">

</select>

使用 Javascript，我需要这样的东西：

function selectOne() {
  var select = document.getElementById('test');
 // for loop goes here?
 //   e.select[0] = new Option(number);  // do this n times with value also equaling number

}

因此，如果数字 = 6，我生成的 HTML 需要如下所示：

<select id="test">  
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
</select>

Answer 1

这构建了 n 个选项：

function selectOne() {
  var select = document.getElementById('test');
  for (var i=0; i<n; i++) {
     select.options[select.options.length] = new Option(i+1, i);
  } 
}

示范

Answer 2

这应该创建您的选项。并且向后兼容许多支持 javascript 的浏览器

function selectOne() {
    for (var selectEle = document.getElementById("test"), i = 1, o; i <= 6;  i += 1) {
        o = document.createElement("option");
        o.value = i;
        o.appendChild(document.createTextNode(i));
        selectEle.appendChild(o);

        /*
        // As pointed out in the comments it can be done as such:
        o = document.createElement("option");
        o.value = o.text = i;
        selectEle.appendChild(o);
        */
    }
}