向下拉列表中添加选项:
(1)首先得获取到下拉列表对象;
var sel=document.getElementById("下拉列表id");
(2)创建下拉列表选项;创建标签使用createElement("标签");
var option=document.create("option");
option.value="添加的选项value值";
option.innerHTML="添加的选项内容";
(3)将选项添加到下拉列表中;
sel.appendChild(option);
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 "http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 6 <title>复习</title> 7 8 <script type="text/javascript"> 9 10 11 function addSelect(){//为下拉列表添加选项 12 13 //1.通过id获取要添加选项的值 14 var courseName=document.getElementById("courseName").value; 15 16 //2.通过id获取下拉列表对象 17 var sel=document.getElementById("select"); 18 19 //3.创建option 20 var option=document.createElement("option"); 21 option.value=courseName; 22 option.innerHTML=courseName; 23 24 //4.将optiont添加到下拉列表中 25 sel.appendChild(option); 26 27 } 28 29 </script> 30 31 </head> 32 33 <body> 34 35 <input type="text" id="courseName"/> 36 <input type="button" value="添加" onclick="addSelect()"/> 37 </br> 38 <select id="select" name="course"> 39 <option value="">--请选择--</option> 40 41 </select> 42 43 44 </body> 45 </html>