<!doctype html> <html> <head> <meta charset="utf-8"> <title>查找表单控件</title> <script type="text/javascript" src="dom7.js"></script> </head> <body id="test"> <input type="button" value="创建一个城市列表框" onClick="create()"> <input type="button" value="一条条删除列表框的内容" onClick="del()"> <input type="button" value="一次性清空列表框内容" onClick="clear1()"> </body> </html>
// JavaScript Document //创建下拉菜单 var sel; function create(){ //创建下拉菜单元素节点 sel=document.createElement("select"); //给sel属性节点赋值 sel.id="myselect"; sel.size=3; //获取body元素节点 var body=document.getElementsByTagName("body")[0]; //将下拉菜单元素节点添加至body标签 body.appendChild(sel); //创建选项节点 for(var i=0;i<5;i++){ //格式：选项节点=new Option(文本节点，value属性节点) var op=new Option("选项"+i,i); //将选项添加到select标签 sel.appendChild(op); } } //一条一条删除option function del(){ //获取最后一个option元素的下标 var index=sel.options.length-1; //删除最后一个元素 sel.remove(index); } //一次性清空option function clear1(){ //让option数组长度为0 sel.options.length=0; }
new Option(text,value,defaultSelected,selected) 该构造器有4个参数，说明如下： text 该选项的文本、即该选项所呈现的“内容” value 选中该选项的值 defaultSelected 设置默认是否显示该选项 selected 设置该选项当前是否被选中 提示：并不是每次构造都需指明4个参数，可以指明一个或者两个都可以，假如一个的话指明的是text，假如二个的话，第一个参数是text，第二个参数是value。 添加创建好的选项至列表框或下拉菜单的方式 直接为<select>的的指定选项赋值 列表框或下拉菜单对象.options[i]=创建好的option对象 删除列表框、下拉菜单的选项的方法 1. 直接使用列表框或下拉菜单对象.remove(index)方法删除指定选项 2. 直接将指定选项赋值为null 列表框或下拉菜单对象.remove(index)或对象.options[index]=null
原文：https://www.cnblogs.com/soda001/p/13557702.html