添加和移除选项

在做三级联动的时候用到了动态的在select标签中添加option，用到了

var opt=new Option(s[i].name,i);

这是添加选项的第一种方法

添加选项

一、使用Option构造函数来创建新选项

Option构造函数接受两个参数：文本（text）和值（value），第二个参数可选，虽然创造的是一个Object实例但是会返回一个<option>元素，因此可以用appendChild()将新选项添加进选择框

var opt=new Option(s[i].name,i);
shi.appendChild(opt);

二、动态创建选项并添加到框中

动态创建一个option元素，为它设立一个文本节点，设置value属性，最后添加到选择框中

            var opt=document.createElement("option");
            opt.appendChild(document.createTextNode("西安市"));
            opt.setAttribute("value","0");
            console.log(opt.value);
            shi.appendChild(opt);

三、使用选择框的add()方法

add()方法接受两个参数：要添加的新选项和将位于新选项之后的选项，如果想在列表的最后添加一个选项，则第二个参数设为null。IE对于这个方法，第二个参数是可选的，而且如果指定，该参数必须是新选项之后选项的索引，兼容DOM的浏览器规定必须指定第二个参数

想要满足在所有浏览器中都将新选项插入到列表的最后，则可以将第二个值设为undefined

var opt=new Option(s[i].name,i);
shi.add(opt,undefined);

移除选项

一、removeChild()方法，传入的是要移除的选项

shi.removeChild(shi.options[0]);

没有了——请选择——的option

二、选择框的remove()方法，传一个参数为要移除选项的索引

shi.remove(0);

三、将相应的选项设置为null

shi.options[0]=null;

将选择框中的全部移除则需要遍历逐个移除，遍历的时候因为每次都移除第一个选项，后续选项会自动上移一个位置，因此只需要重复移除第一位就可以了