级联下拉select

html:

<select name="" id="select1"></select>
<select name="" id="select2"></select>

js: 

var select1=document.getElementById("select1") ;
var select2=document.getElementById("select2") ;
var data1 =["搜索引擎","营销广告","其他"];
var data2=[
    ["百度","谷歌","360" ],
    ["视频广告","新闻广告","邮件广告" ],
    ["展板","其他"]
];
//初始化一级二级select
select1.add(new Option( '请选择',''),null);
select2.add(new Option('请选择',''),null);
for( var i=0; i<data1.length ;i++){
    select1.add(new Option( data1[i],data1[i]),null);
}
/*for( var i=0; i<data2[0].length ;i++){
    select2.add(new Option(data2[0][i],data2[0][i]),null);
}*/
/*当选择一级菜单时改变二级菜单的option */
select1.onchange = function(){
    var index = select1.selectedIndex ;
    if(index == 0){
        select2.innerHTML ="<option value=''>请选择</option>";
    }else{
        select2.innerHTML ="<option value=''>请选择</option>";
        for( var i=0; i<data2[index-1].length ;i++){
            select2.add(new Option(data2[index-1][i],data2[index-1][i]),null);
        }
    }
};