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;