select等常用html控件方法及示例

<select>

option的方法

增加一个<option>标签-----obj.options.add(new("文本","值"));<增>

删除一个<option>标签-----obj.options.remove(obj.selectedIndex)<删>

获得一个<option>标签的文本-----obj.options[obj.selectedIndex].text<查>

修改一个<option>标签的值-----obj.options[obj.selectedIndex]=new Option("新文本","新值")<改>

删除所有<option>标签-----obj.options.length = 0

获得一个<option>标签的值-----obj.options[obj.selectedIndex].value

1.动态创建select

      function createSelect(){

       var mySelect = document.createElement("select");
mySelect.id = "mySelect";
document.body.appendChild(mySelect);
}

2.添加选项option

     function addOption(){

          //根据id查找对象,
var obj=document.getElementById('mySelect');

           //添加一个选项
obj.add(new      Option("文本","值"));    //这个只能在IE中有效
obj.options.add(new Option("text","value")); //这个兼容IE与firefox
}

3.删除所有选项option

     function removeAll(){
var obj=document.getElementById('mySelect');

obj.options.length=0;

     }

4.删除一个选项option

function removeOne(){
var obj=document.getElementById('mySelect');

           //index,要删除选项的序号,这里取当前选中选项的序号

        var index=obj.selectedIndex;
obj.options.remove(index);
}

5.获得选项option的值

var obj=document.getElementById('mySelect');

var index=obj.selectedIndex; //序号,取当前选中选项的序号

var val = obj.options[index].value;

6.获得选项option的文本

var obj=document.getElementById('mySelect');

var index=obj.selectedIndex; //序号,取当前选中选项的序号

var val = obj.options[index].text;

7.修改选项option

var obj=document.getElementById('mySelect');

var index=obj.selectedIndex; //序号,取当前选中选项的序号

var val = obj.options[index]=new Option("新文本","新值");

8.删除select

      function removeSelect(){
var mySelect = document.getElementById("mySelect");
mySelect.parentNode.removeChild(mySelect);
}

详细参照:http://www.cnblogs.com/dcba1112/archive/2011/05/26/2057551.html

posted @ 2012-12-13 10:14  Bingo_  阅读(197)  评论(0编辑  收藏  举报