JavaScript动态添加和修改Select下拉框

1使用DOM对象

var s=document.getElementById("theYear");//获取需要添加的select

          var year=new Date();//获取当前时间

          var number=0;//从第0个开始添加

          for(var i=1990;i<=year.getYear();i++){

             var option =new Option(i+"年",i);//设置选项(text,value)

                 s.options[number]=option;//添加

             if(i==year.getYear()){

                 s.options[number].selected=true;//设置默认值

             }

             number++;

           }

 

 

2使用Object对象

 

var s2 = document.getElementById("lastTime");

          var values =new Array();//设置数据组

          values[0]="10年";

          values[1]="20年";

          values[2]="30年";

          values[3]="50年";

          values[4]="永久";

          for(var i=0;i<values.length;i++){

             var option=document.createElement("option");//创建对象

             var text=document.createTextNode(values[i]);

             option.appendChild(text);//设置text值

             option.value=values[i];//设置Value值

             if(i==(values.length-1)){//取最后一个为默认

             option.selected=true;

             }

             s2.appendChild(option);//添加对象

           }

 

3使用innerHTML

 

var s3 =  document.getElementById( " inner " );  //某位置添加控件引用ID，如使用<Div id=”inner”></Div>，生成select会在DIV内显示

          var str =   " <select> " ;  

          for (var i = 0 ;i < 10;i ++ )  

           {  

           str  =  str  +   " <option value=' " + i +" '> " + i + " </option> "   

           }   

           str = str + " </select> " ;  

           s3.innerHTML = str;