如图的几个相关联的菜单如何编写,用XHTML编写？？

复制内容到剪贴板

代码:

<select id="province" onChange="xxx(this.options[this.selectedIndex].value);">
   <option>请选择省份...</option>
</select>

<select id="city">
   <option>请选择城市...</option>
</select>
<script language="javascript">
var citys=[
['北京',[['北京'],['通县'],['昌平'],['大兴'],['密云'],['延庆'],['顺义'],['怀柔'],['平台']]],
['上海',[['上海市'],['嘉定'],['松江'],['南汇'],['奉贤'],['川沙'],['青浦'],['崇明'],['金山']]]
];

var prov = document.getElementById('province');
var city = document.getElementById('city');
city.style.display = 'none';
for(var i = 0; i < citys.length; i++)
{
    prov.options[i+1] = new Option(citys[i][0],i);
}
function xxx(k)
{
    city.style.display = '';
    for(var i = 0; i <citys[k][1].length; i++)
    {
        city.options[i+1] = new Option(citys[k][1][i],i);
    }
}
</script>