可以使用JavaScript 动态创建选项并将它们添加到选择框。首先可以使用DOM方法如下所示let newOption document.createElement(“option”);newOption.appendChild(document.createTextNode(“Option text”));newOption.setAttribute(“value”, “Option value”);selectbox.appendChild(newOption);以上代码创建了一个新的元素使用文本节点添加文本设置其value 属性然后将其添加到选择框。添加到选择框之后新选项会立即显示出来。另外也可以使用Option 构造函数创建新选项这个构造函数是DOM出现之前就已经得到浏览器支持的。Option 构造函数接收两个参数text 和value其中value 是可选的。虽然这个构造函数通常会创建Object 的实例但DOM 合规的浏览器都会返回一个元素。这意味着仍然可以使用appendChild()方法把这样创建的选项添加到选择框。比如下面的例子let newOption new Option(“Option text”, “Option value”);selectbox.appendChild(newOption); // 在IE8 及更低版本中有问题这个方法在除IE8 及更低版本之外的所有浏览器中都没有问题。由于实现问题IE8 及更低版本在这种情况下不能正确设置新选项的文本。另一种添加新选项的方式是使用选择框的add()方法。DOM 规定这个方法接收两个参数要添加的新选项和要添加到其前面的参考选项。如果想在列表末尾添加选项那么第二个参数应该是null。IE8 及更早版本对add()方法的实现稍有不同其第二个参数是可选的如果要传入则必须是一个索引值表示要在其前面添加新选项的选项。DOM 合规的浏览器要求必须传入第二个参数因此在跨浏览器方法中不能只使用一个参数IE9 是符合DOM规范的。此时传入undefined 作为第二个参数可以保证在所有浏览器中都将选项添加到列表末尾。下面是一个例子let newOption new Option(“Option text”, “Option value”);selectbox.add(newOption, undefined); // 最佳方案以上代码可以在所有版本的IE 及DOM 合规的浏览器中使用。如果不想在最后插入新选项则应该使用DOM 技术和insertBefore()。移除选项与添加选项类似移除选项的方法也不止一种。第一种方式是使用DOM 的removeChild()方法并传入要移除的选项比如selectbox.removeChild(selectbox.options[0]); // 移除第一项第二种方式是使用选择框的remove()方法。这个方法接收一个参数即要移除选项的索引比如selectbox.remove(0); // 移除第一项最后一种方式是直接将选项设置为等于null。这同样也是DOM 之前浏览器实现的方式。下面是一个例子selectbox.options[0] null; // 移除第一项要清除选择框的所有选项需要迭代所有选项并逐一移除它们如下面例子所示function clearSelectbox(selectbox) {for (let option of selectbox.options) {selectbox.remove(0);}}这个函数可以逐一移除选择框中的每一项。因为移除第一项会自动将所有选项向前移一位所以这样就可以移除所有选项。