原生js二级联动效果

//创建两个下拉列表 select标签 是下拉列表   var sel = document.createElement("select");   var sel1 = document.createElement("select");   //添加到body   document.body.appendChild(sel);   document.body.appendChild(sel1);//   创建一个数组   var firstSelectArr = ["未选择","医院","学校","公司","星座"];   var detailFirstArr = ["未选择","院长","主任","大夫","护士"];   var detailSecondArr = ["未选择","校长","老师","学生","主任"];   var arr2 = ["未选择","CEO","职员","主任","下属"];   var arr3 = ["未选择","白羊座","射手座","处女座","天秤座"];   function addChild(arr,parentN){    //封装函数    for(var i=0;i<arr.length;i++){    //创建 option节点    var opt = document.createElement("option");    //设置显示文字    opt.innerText = arr[i];    //把节点添加到sel中    parentN.appendChild(opt);       }   }   //调用函数 给第一个select添加option   addChild(firstSelectArr,sel)      //循环创建多个下拉选项      //给第一个下拉列表添加onchange事件   //onchange事件：当元素的值发生改变时，触发此事件。   sel.onchange = function (){//    selectdIndex.下拉列表的索引     console.log(sel.selectedIndex);     switch (sel.selectedIndex){      case 0:      alert("未选择");      break;      case 1:      delectOldOpt();      addChild(detailFirstArr,sel1);      break;      case 2:      delectOldOpt();      addChild(detailSecondArr,sel1);      break;      case 3:      delectOldOpt();      addChild(arr2,sel1);      break;      case 4:      delectOldOpt();     addChild(arr3,sel1);      break;     }              }   //删除select原来的option   function delectOldOpt(){    //到这删除下拉列表中的选项    for(var i=sel1.childNodes.length-1;i>=0;i--){     //删除选项     sel1.removeChild(sel1.childNodes[i]);    }       }