📄 9-41.html

📁 介绍了javascript的常用的函数

💻 HTML

字号:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE>JavaScript Book--代码9-41</TITLE>
 <script language="JavaScript" src="loadXMLDoc.js"></script>
 </HEAD>
<script>
  var root;
  function selectProvice()
  {
	var source;
	var sourceName = "citys.xml";
	var source = loadXMLDoc(sourceName);
   //设置文档元素为根节点元素
	root = source.documentElement;   
//搜索属性中含有name的所有节点
	nodes=root.selectNodes("//@name");  
	for(var i=0;i<nodes.length;++i)   
	{
		var oOption = document.createElement('OPTION');
		oOption.text = " "+nodes[i].text+" ";
		oOption.value = nodes[i].text;
		form1.selProvice.options.add(oOption); 
	}
	//加载页面时把省的信息加入，同时把城市信息也加入
	//以后再通过selectCity（）来触发
	selectCity();
  }

  function selectCity()
  {
    //在selcity中删除
    for(var i=form1.selCity.options.length-1;i>=0;--i)
	{
		form1.selCity.options.remove(i)
	}
    //读取省份下拉框的当前选项
	x=form1.selProvice.selectedIndex;   
	y=form1.selProvice.options[x].value;
	//搜索name属性值等于参数y的province节点下的所有city节点
	nodes=root.selectNodes("//province[@name='"+y+"']/city");   
	//增加城市名称到下拉列表
	for(var i=0;i<nodes.length;++i)   
	{
		var oOption = document.createElement('OPTION'); 
		oOption.text = " "+nodes[i].text+" ";
		oOption.value = nodes[i].text;
		form1.selCity.options.add(oOption); 
	}
 }
	 
</script>
<BODY onLoad="selectProvice()">
	  <FORM action="" method="post" id="form1" name="form1">
		<SELECT name="selProvice" id="selProvice" 
onchange="selectCity()" >
		 </SELECT>
		 <SELECT name="selCity" id="selCity" >
		 </SELECT>
	  </FORM>
</BODY>
</HTML>

⌨️ 快捷键说明

复制代码 Ctrl + C

搜索代码 Ctrl + F

全屏模式 F11

切换主题 Ctrl + Shift + D

显示快捷键 ?

增大字号 Ctrl + =

减小字号 Ctrl + -