是首先应该添加两个下拉列表并设置id属性来方便操作：

1 2     国家3 4 5     城市6 

js代码中首先需要声明国家和城市两个数组：

var country = ['中国', '美国','英国']var city = [    ['北京', '上海'],    ['纽约'],    ['伦敦']]

然后通过id获取页面中的下拉菜单元素：

var cou = document.getElementById("country");var cit = document.getElementById("city");

然后初始化第一个列表：

//初始化国家下拉列表for(var i = 0; i < country.length; i++) {    //新的option    var option = new Option()    //赋值            option.appendChild(document.createTextNode(country[i]))    //插入    cou.appendChild(option)}

在第一个下拉列表中选择国家后，第二个列表显示相应的城市：

//为国家下拉列表添加事件cou.addEventListener('change', function(){    //另城市列表变为初始状态，可以注释掉查看效果    cit.options.length = 1;    //如果国家选择不为默认值    if(cou.selectedIndex != 0) {        //遍历相应国家的城市        for(var j = 0; j < city[cou.selectedIndex - 1].length; j++) {            var option2 = new Option(city[cou.selectedIndex-1][j],city[cou.selectedIndex-1][j])            cit.options.add(option2)        }    }});

            
                                          国家                            城市