可以使用JavaScript动态创建选项，并将它们添加到选择框中。添加选项的方式有很多，第一种方式就是使用如下所示的DOM方法。

<script type="text/javascript">
var newOption = document.createElement("option");
newOption.appendChild(document.createTextNode("Option text"));
newOption.setAttribute("value","Option value");

selectbox.appendChild(newOption);
</script>

phpcms常见问题dedecms常见问题帝国cms常见问题discuz常见问题增加选项

以上代码创建了一个新的<option>元素，然后为它添加了一个文本节点，并设置其value特性，最后将它添加到了选择框中。添加到选择框之后，用户立即就可以看到新选项。

第二种方式是使用Option构造函数来创建新选项，这个构造函数是DOM出现之前就有的，一直遗留到现在。Option构造函数接受两个参数：文本(text)和值(value)，第二个参数可选。虽然这个构造函数会创建一个Object的实例，但兼容DOM的浏览器会返回一个<option>元素。换句话说，在这种情况下，我们仍然可以使用appendChild()将新选项添加到选择框中。来看下面的例子。

var newOption = new Option("Option text","Option value");
selectbox.appendChild(newOption);	//在IE8及之前版本中有问题

第三种添加新选项的方式是使用选择框的add()方法。DOM规定这个方法接受两个参数：要添加的新选项和将位于新选项之后的选项。如果想在列表的最后添加一个选项，应该将第二个参数设置为null。在IE对add()方法的实现中，第二个参数是可选的，而且如果指定，该参数必须是新选项之后选项的索引。兼容DOM的浏览器要求必须指定第二个参数，因此要想编写跨浏览器的代码，就不能只传入一个参数。这时候，为第二个参数传入undefined，就可以在所有浏览器中都将新选项插入到列表最后了。来看一个例子。

var newOption = new Option("Option text","Option value");
selectbox.add(newOption, undefined);	//最佳方案

在IE和兼容DOM的浏览器中，上面的代码都可以正常使用。如果你想将新选项添加到其他位置（不是最后一个），就应该使用标准的DOM技术和insertBefore()方法。

就和在HTML中一样，此时也不一定要为选项指定值。换句话说，只为Option构造函数传入一个参数（选项的文本）也没有问题。